/***********************
modal common
***********************/

.btn_close_modal {
  position: absolute;
  top: -20px;
  right: 0;
  border: 5px solid #fff;
  box-shadow: none;
  z-index: 2;
}

.btn_close_modal img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1.8vw;
  height: 1.8vw;
}

.modal_contents_inner {
  height: 100%;
  overflow: auto;
}

.modal_heading {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 2px solid #515d62;
  padding-bottom: 0.7vw;
}

.modal_heading_icon {
  width: 2.3vw;
}

.modal_heading_title {
  font-size: 1.8vw;
  color: #4c556e;
  padding: 0 0.5em;
  font-weight: bold;
  margin: 2px;
}

.modal_heading_warning {
  text-align: right;
  width: 80%;
}

.modal_heading_warning_comment {
  font-size: 1vw;
  color: #4c556e;
  display: inline-block;
}

.modal_heading button {
  background-color: #30C40C;
  color: #fff;
  font-size: 1.2vw;
  padding: 0.2em 2.0em;
  border-radius: 10px;
  margin: 0 0 0 1em;
}

.modal_contents_form {
  padding: 1.0vw 0;
}

.modal_send {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.modal_row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 1.5vw 0;
}

/* 中央揃え */
.modal_row_center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* 左右の端を空けずに均等に間隔をあける */
.modal_row_space_between {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

/* 左右の端を空けて均等に間隔をあける */
.modal_row_space_around {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

/* 改行させる */
.modal_row_wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* 行の下点線 */
.modal_row_dotted_border {
  border-bottom: 0.2vw dotted #515d62;
}

.modal_checkbox input[type=checkbox],
.modal_textbox input[type="text"],
.modal_contents_form textarea,
.modal_timebox input[type="time"],
.modal_calendar label input[type="date"],
.modal_selectbox select,
.modal_radio. input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}


/* チェックボックス */
.modal_checkbox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.modal_checkbox input[type="checkbox"] {
  display: none;
}

.modal_checkbox .label {
  position: relative;
  padding: 0 0 0 3.2vw;
  font-size: 1.2vw;
  letter-spacing: 0.1em;
  color: #515d62;
}

.modal_checkbox .label:after,
.modal_checkbox .label:before {
  position: absolute;
  content: "";
  display: block;
  top: 50%;
  transform: translate(0, -50%);
}

.modal_checkbox .label:after {
  left: 0;
  width: 1.8vw;
  height: 1.8vw;
  border: 1px solid #30c40c;
  border-radius: 3px;
}

.modal_checkbox .label:before {
  left: 9px;
  margin-top: -7px;
  width: 5px;
  height: 9px;
  border-right: 2px solid #30c40c;
  border-bottom: 2px solid #30c40c;
  transform: rotate(45deg);
  opacity: 0;
}

.modal_checkbox input[type=checkbox]:checked + .label:before {
  opacity: 1;
}

/* width: 100% (.modal_row_wrapと組み合わせてカラム落ちさせる)*/
.w100 {
  width: 100%;
}

/* テキストボックス */
.modal_textbox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.2vw;
  color: #515d62;
}

.modal_textbox input[type="text"] {
  border: 1px solid #30c40c;
  border-radius: 3px;
  margin: 0 1em;
  padding: 1.0em;
  font-size: 1.2vw;
}

/* テキストエリア */
.modal_contents_form textarea {
  border: 1px solid #30c40c;
  border-radius: 3px;
  padding: 0.5em;
  font-size: 1.2vw;
}

/* 時間選択 */
.modal_timebox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.2vw;
  color: #515d62;
}

.modal_timebox input[type="time"] {
  border: 1px solid rgb(48, 196, 12);
  background-color: rgb(255, 255, 255);
  /*    border-radius: 10em;*/
  font-size: 1.6vw;
  color: #515d62;
  padding: 0 1.5em 0 3.0em;
  margin: 0 0.5em;
  width: 15.0vw;
  height: 3.9vw;
}

/*
.modal_timebox img {
  margin-right: 0.5em;
}
*/

/* セレクトボックス */
.modal_selectbox select::-ms-expand {
  display: none;
}

.modal_selectbox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.2vw;
  color: #515d62;
}

.modal_selectbox select {
  border: 1px solid rgb(48, 196, 12);
  background-color: rgb(255, 255, 255);
  /*    border-radius: 10em;*/
  font-size: 1.6vw;
  color: #515d62;
  padding: 0 1.5em;
  margin: 0 0.5em;
  width: 11vw;
  height: 3.9vw;
}

.modal_selectbox img {
  margin-right: 0.5em;
}

.modal_selectbox input[type="time"] {
  border: 1px solid rgb(48, 196, 12);
  background-color: rgb(255, 255, 255);
  font-size: 1.6vw;
  color: #515d62;
  height: 3.9vw;
  width: 11vw;
  margin: 0 0.5em 0 0.2em;
  text-align: center;
}

.modal_selectbox select.napRoom {
  width: 11vw !important;
  font-size: 1.0vw;
  padding: 0;
  margin: 0 0.5em 0 0.2em !important;
}

/* カレンダー */
.modal_calendar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.2vw;
  color: #515d62;
}

.modal_calendar label {
  position: relative;
}

.modal_calendar label::before {
  position: absolute;
  top: calc(50% - 1.5vw);
  right: 0;
  content: "";
  width: 3.0vw;
  height: 3.0vw;
  background-image: url(../img/ic/calender.svg);
  background-repeat: no-repeat;
  background-position: center;
}

.modal_calendar label input[type="date"] {
  opacity: 0;
}

.modal_calendar input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 0px;
  top: calc(50% - 1.5vw);
  padding: 0;
  width: 3.0vw;
  height: 3.0vw;
  background: transparent;
  color: transparent;
  cursor: pointer;
}

.modal_calendar input[type="date"]::-webkit-inner-spin-button{
  -webkit-appearance: none;
}
.modal_calendar input[type="date"]::-webkit-clear-button{
  -webkit-appearance: none;
}

/* ラジオボタン */
.modal_radio label {
  position: relative;
  display: block;
  border-radius: 0.2em;
  font-size: 1.0vw;
  font-weight: bold;
  border: solid 1px rgb(231, 231, 231);
  border-radius: 10px;
  background-image: -moz-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  background-image: -webkit-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  background-image: -ms-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  box-shadow: 0px 5px 15px 0px rgba(153, 153, 153, 0.3);
  padding: 0.5em 1em;
  color: #515d62;
  width: 6.5vw;
  height: 7.0vw;
}

.modal_radio label::before {
  content: "";
  width: 4.5vw;
  height: 4.0vw;
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translate(-50%, 0);
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 85%;
}

.modal_radio label::after {
  content: "";
  width: 4.5vw;
  height: 1.0vw;
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translate(-50%, 0);
  display: block;
  text-align: center;
}


.modal_radio input[type="radio"]:checked + label {
  background-image: -webkit-linear-gradient(top left, #30c40c 0%, #30c40c 100%);
  background-image: -o-linear-gradient(top left, #30c40c 0%, #30c40c 100%);
  background-image: linear-gradient(to bottom right, #30c40c 0%, #30c40c 100%);
  box-shadow: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
}

/* 送信ボタン */
button.btn_modal_send {
  display: block;
  width: 5.9vw;
  height: 5.9vw;
  border-radius: 100%;
  border: solid 1px rgb(34, 191, 135);
  background-image: -moz-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  background-image: -webkit-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  background-image: -ms-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  box-shadow: 0px 2px 4px 0px rgba(196, 196, 196, 0.4);
  opacity: 1;
  position: relative;
  left: 0;
  top: 0;
  transition: all 0.5s cubic-bezier(0, 1.1, 1, 1);
}

button.btn_modal_send::before {
  content: "";
  background-image: url("../img/ic/send.svg");
  width: 5.9vw;
  height: 5.9vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60%;
}

button.btn_modal_send:disabled {
  opacity: 0.2;
  border: solid 1px #9E9E9E;
  background-image: -moz-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  background-image: -webkit-linear-gradient(-135deg, #9E9E9E 0%, rgb(41, 41, 41) 100%);
}

/* ダウンロードボタン */
button.btn_modal_download {
  display: block;
  width: 5.9vw;
  height: 5.9vw;
  border-radius: 100%;
  border: solid 1px rgb(34, 191, 135);
  background-image: -moz-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  background-image: -webkit-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  background-image: -ms-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  box-shadow: 0px 2px 4px 0px rgba(196, 196, 196, 0.4);
  opacity: 1;
  position: relative;
  left: 0;
  top: 0;
  transition: all 0.5s cubic-bezier(0, 1.1, 1, 1);
}

button.btn_modal_download::before {
  content: "";
  background-image: url("../img/ic/download.svg");
  width: 5.9vw;
  height: 5.9vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60%;
}

button.btn_modal_download:disabled {
  opacity: 0.2;
  border: solid 1px #9E9E9E;
  background-image: -moz-linear-gradient(-135deg, rgb(45, 214, 4) 0%, rgb(4, 190, 144) 100%);
  background-image: -webkit-linear-gradient(-135deg, #9E9E9E 0%, rgb(41, 41, 41) 100%);
}

/* placeholder */
.modal_contents_form ::-webkit-input-placeholder {
  color: #e6e6e6;
  text-align: left;
}

.modal_contents_form :-moz-placeholder {
  color: #e6e6e6;
  text-align: left;
}

.modal_contents_form ::-moz-placeholder {
  color: #e6e6e6;
  text-align: left;
}

.modal_contents_form :-ms-input-placeholder {
  color: #e6e6e6;
  text-align: left;
}



.mood_select {
  display: flex;
  justify-content: space-around;
  width: 32.0vw;
  padding: 0 1.5em;
  margin: 0 auto 2em;
}

.condition_select {
  background-color: #dedede;
  border-radius: 10px;
  padding: 1.5em 2.5em 1.5em;
  position: relative;
  width: 35vw;
  margin: 0 0 0;
}

.condition_select:before {
  content: '';
  position: absolute;
  right: 20%;
  top: -1em;
  display: block;
  width: 0;
  height: 0;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #dedede;
  border-left: 15px solid transparent;
}

.mood_select li button {
  border: solid 1px rgb(231, 231, 231);
  border-radius: 10px;
  background-image: -moz-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  background-image: -webkit-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  background-image: -ms-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  box-shadow: 0px 5px 15px 0px rgba(153, 153, 153, 0.3);
  padding: 0.5em 1em;
  color: #515d62;
}

.mood_select img {
  width: 4.5vw;
  height: 4.0vw;
}

.mood_select span {
  display: block;
  font-size: 1.0vw;
  font-weight: bold;
}

.mood_select li button:hover {
  background-image: -moz-linear-gradient(-135deg, #30c40c 0%, #30c40c 100%);
  background-image: -webkit-linear-gradient(-135deg, #30c40c 0%, #30c40c 100%);
  background-image: -ms-linear-gradient(-135deg, #30c40c 0%, #30c40c 100%);
  color: #ffffff;
}


.excretion_select {
  display: flex;
  justify-content: space-between;
  width: 42.1vw;
}

.condition_other {
  width: 4.5vw;
  height: 5.7vw;
  line-height: 5.7vw;
}

/*スイッチボタン白*/
.switch_white {
  position: relative;
  display: inline-block;
  width: 10vw;
  height: 3.0vw;
  background-color: white;
  border: solid 1px rgb(48, 196, 12);
  border-radius: 10em;
  cursor: pointer;
}

.switch_white .switch-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.switch_white .switch-label {
  position: relative;
  display: block;
  height: 2.9vw;
  font-size: 1.2vw;
  text-transform: uppercase;
  background: #ffffff;
  border-radius: inherit;
  -webkit-transition: 0.15s ease-out;
  -moz-transition: 0.15s ease-out;
  -o-transition: 0.15s ease-out;
  transition: 0.15s ease-out;
  -webkit-transition-property:
    opacity background;
  -moz-transition-property: opacity background;
  -o-transition-property: opacity background;
  transition-property: opacity background;
}

.switch_white .switch-label:before,
.switch_white .switch-label:after {
  position: absolute;
  top: 50%;
  margin-top: -.5em;
  line-height: 1;
  -webkit-transition: inherit;
  -moz-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}

.switch_white .switch-label:before {
  content: attr(data-off);
  right: 15%;
  color: #30c40c;
}

.switch_white .switch-label:after {
  content: attr(data-on);
  left: 15%;
  color: #30c40c;
  opacity: 0;
}

.switch_white .switch-handle:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 15%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 2.6vw;
  height: 2.6vw;
  background: #30c40c;
  border-radius: 50%;
}

.switch_white .switch-input:checked ~ .switch-handle:before {
  left: 85%;
}

.switch_white .switch-input:checked ~ .switch-label {
  background: #ffffff;
}

.switch_white .switch-input:checked ~ .switch-label:before {
  opacity: 0;
}

.switch_white .switch-input:checked ~ .switch-label:after {
  opacity: 1;
}

/*スイッチボタン緑*/
.switch_green {
  position: relative;
  display: inline-block;
  width: 11vw;
  padding: 2.0em;
  background-color: #30c40c;
  border: solid 1px rgb(48, 196, 12);
  border-radius: 10em;
  cursor: pointer;
}

.switch_green .switch-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.switch_green .switch-label {
  position: relative;
  display: block;
  height: inherit;
  font-size: 1.2vw;
  text-transform: uppercase;
  background: #ffffff;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
  -webkit-transition: 0.15s ease-out;
  -moz-transition: 0.15s ease-out;
  -o-transition: 0.15s ease-out;
  transition: 0.15s ease-out;
  -webkit-transition-property:
    opacity background;
  -moz-transition-property: opacity background;
  -o-transition-property: opacity background;
  transition-property: opacity background;
}

.switch_green .switch-label:before,
.switch_green .switch-label:after {
  position: absolute;
  top: 50%;
  margin-top: -.5em;
  line-height: 1;
  -webkit-transition: inherit;
  -moz-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}

.switch_green .switch-label:before {
  content: attr(data-off);
  right: 15%;
  color: #ffffff;
}

.switch_green .switch-label:after {
  content: attr(data-on);
  left: 15%;
  color: #ffffff;
  opacity: 0;
}

.switch_green .switch-handle:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 18%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 3.5vw;
  height: 3.5vw;
  background: rgb(253, 253, 253);
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15);
  border-radius: 50%;
}

.switch_green .switch-input:checked ~ .switch-handle:before {
  left: 83%;
}

.switch_green .switch-input:checked ~ .switch-label {
  background: #ffffff;
}

.switch_green .switch-input:checked ~ .switch-label:before {
  opacity: 0;
}

.switch_green .switch-input:checked ~ .switch-label:after {
  opacity: 1;
}

/*スイッチボタン緑2*/
/*出勤退勤スケジュールで使用*/
.switch_green2 {
  position: relative;
  display: inline-block;
  width: 11vw;
  padding: 2.0em;
  background-color: #30c40c;
  border: solid 1px rgb(48, 196, 12);
  border-radius: 10em;
  cursor: pointer;
}

.switch_green2 .switch-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.switch_green2 .switch-label {
  position: relative;
  display: block;
  height: inherit;
  font-size: 1.2vw;
  text-transform: uppercase;
  background: #ffffff;
  border-radius: inherit;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
  -webkit-transition: 0.15s ease-out;
  -moz-transition: 0.15s ease-out;
  -o-transition: 0.15s ease-out;
  transition: 0.15s ease-out;
  -webkit-transition-property:
    opacity background;
  -moz-transition-property: opacity background;
  -o-transition-property: opacity background;
  transition-property: opacity background;
}

.switch_green2 .switch-label:before,
.switch_green2 .switch-label:after {
  position: absolute;
  top: 50%;
  margin-top: -.5em;
  line-height: 1;
  -webkit-transition: inherit;
  -moz-transition: inherit;
  -o-transition: inherit;
  transition: inherit;
}

.switch_green2 .switch-label:before {
  content: attr(data-off);
  right: 15%;
  color: #ffffff;
}

.switch_green2 .switch-label:after {
  content: attr(data-on);
  left: 15%;
  color: #ffffff;
  opacity: 0;
}

.switch_green2 .switch-handle:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 18%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 2.8vw;
  height: 2.6vw;
  background: rgb(253, 253, 253);
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15);
  border-radius: 50%;
}

.switch_green2 .switch-input:checked ~ .switch-handle:before {
  left: 83%;
}

.switch_green2 .switch-input:checked ~ .switch-label {
  background: #ffffff;
}

.switch_green2 .switch-input:checked ~ .switch-label:before {
  opacity: 0;
}

.switch_green2 .switch-input:checked ~ .switch-label:after {
  opacity: 1;
}

/*写真選択*/
.photo_select {
  border-radius: 5px;
  background-image: -moz-linear-gradient(45deg, rgb(81, 93, 98) 0%, rgb(122, 141, 149) 100%);
  background-image: -webkit-linear-gradient(45deg, rgb(81, 93, 98) 0%, rgb(122, 141, 149) 100%);
  background-image: -ms-linear-gradient(45deg, rgb(81, 93, 98) 0%, rgb(122, 141, 149) 100%);
  box-shadow: 0px 3px 7px 0px rgba(238, 238, 238, 0.4);
  width: 5.5vw;
  height: 5.5vw;
  color: #ffffff;
}

.photo_select:active {
  box-shadow: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
}

.photo_select img {
  width: 2.7vw;
}

.photo_select:hover {
  border-radius: 5px;
  background-image: -moz-linear-gradient(45deg, rgb(122, 141, 149) 0%, rgb(81, 93, 98) 100%);
  background-image: -webkit-linear-gradient(45deg, rgb(122, 141, 149) 0%, rgb(81, 93, 98) 100%);
  background-image: -ms-linear-gradient(45deg, rgb(122, 141, 149) 0%, rgb(81, 93, 98) 100%);
}

.lunch_menu_select {
  display: flex;
  flex-wrap: wrap;
}

.lunch_menu_select li {
  margin-right: 1em;
}

.menu_label {
  display: block;
  border: 2px solid #535e64;
  background: #535e64;
  color: #ffffff;
  padding: 0.5em 0.6em;
  border-radius: 0.2em;
  font-size: 1.1vw;
/*  white-space: nowrap;*/
	word-break: break-word;
}

.lunch_menu_select li input[type="checkbox"]:checked + label {
  background: #ffffff;
  color: #535e64;
}

/*スライドバー*/
.lunch_amount-select-number {
  position: relative;
  display: block;
  bottom: 3px;
}

.lunch_amount-select-number li {
  position: absolute;
  display: block;
  top: -3em;
  color: #30c40c;
  font-size: 1.3vw;
  height: 30px;
}


.lunch_amount-select-number li p{
  text-align: center;
}

.lunch_amount-select-number li:nth-of-type(1) {
  left: 1.5vw;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(2) {
  left: 12.5%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(3) {
  left: 21.85%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(4) {
  left: 31.15%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(5) {
  left: 40.5%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(6) {
  left: 49.7%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(7) {
  left: 59.15%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(8) {
  left: 68.5%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(9) {
  left: 77.75%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(10) {
  left: 87%;
  transform: translate(-50%, 0);
}

.lunch_amount-select-number li:nth-of-type(11) {
  left: calc(100% - 1.5vw);
  transform: translate(-40%, -25%);
}

.lunch_amount-select-ber {
  position: relative;
  display: block;
}

.lunch_amount-select-ber li {
  position: absolute;
  display: block;
  top: -2.5em;
  border-left: solid 2px #efefef;
  padding: 0.5em 0;
}

.lunch_amount-select-ber li:nth-of-type(1) {
  left: 1.5vw;
  padding: 0.8em 0;
}

.lunch_amount-select-ber li:nth-of-type(2) {
  left: 12.5%;
}

.lunch_amount-select-ber li:nth-of-type(3) {
  left: 21.85%;
}

.lunch_amount-select-ber li:nth-of-type(4) {
  left: 31.15%;
}

.lunch_amount-select-ber li:nth-of-type(5) {
  left: 40.5%;
}

.lunch_amount-select-ber li:nth-of-type(6) {
  left: 49.7%;
}

.lunch_amount-select-ber li:nth-of-type(7) {
  left: 59.15%;
}

.lunch_amount-select-ber li:nth-of-type(8) {
  left: 68.5%;
}

.lunch_amount-select-ber li:nth-of-type(9) {
  left: 77.75%;
}

.lunch_amount-select-ber li:nth-of-type(10) {
  left: 87%;
}

.lunch_amount-select-ber li:nth-of-type(11) {
  left: calc(100% - 1.6vw);
  padding: 0.8em 0;
}

.amount-select-slider {
  width: 100%;
  display: block;
  position: relative;
}

.slider {
  -webkit-appearance: none;
  width: 100%;
}

.slider:focus {
  outline: none;
}

.slider::-webkit-slider-runnable-track {
  cursor: pointer;
  background: #efefef;
  border-radius: 10rem;
  height: 1.1vw;
  width: 100%;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: #30c40c;
  border: none;
  cursor: pointer;
  height: 3.0vw;
  margin-top: -14px;
  width: 3.0vw;
  border-radius: 50%;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15);
}


/***********************
modal individual
***********************/

/*** 機嫌 ***/
.mood_form textarea[type="text"] {
  width: 100%;
  height: 10.0vw;
}

.mood_form .modal_textbox input {
  width: 100%;
  margin: 0;
}

.mood_form .modal_radio label.mood_good::before {
  background-image: url("../img/ic/mood_good.svg");
}

.mood_form .modal_radio label.mood_good::after {
  content: "良い";
}

.mood_form .modal_radio label.mood_bad::before {
  background-image: url("../img/ic/mood_bad.svg");
}

.mood_form .modal_radio label.mood_bad::after {
  content: "悪い";
}

.mood_form .modal_radio label.condition_bad::before {
  background-image: url("../img/ic/condition_bad.svg");
}

.mood_form .modal_radio label.condition_bad::after {
  content: "体調不良";
}

.mood_form .modal_radio label.condition_cough::before {
  background-image: url("../img/ic/condition_cough.svg");
}

.mood_form .modal_radio label.condition_cough::after {
  content: "咳";
}

.mood_form .modal_radio label.condition_nasal::before {
  background-image: url("../img/ic/condition_nasal.svg");
}

.mood_form .modal_radio label.condition_nasal::after {
  content: "鼻水";
}

.mood_form .modal_radio label.condition_stomach::before {
  background-image: url("../img/ic/condition_stomach.svg");
}

.mood_form .modal_radio label.condition_stomach::after {
  content: "腹痛";
}

.mood_form .modal_radio label.mood_bad::before {
  background-image: url("../img/ic/mood_bad.svg");
}

.mood_form .modal_radio label.condition_other::before {
  content: none;
}

.mood_form .modal_radio label.condition_other::after {
  content: "その他";
  height: 7.0vw;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  line-height: 7.0vw;
}

.mood_form .modal_radio input[type="checkbox"]:checked + label {
  background-image: -webkit-linear-gradient(top left, #30c40c 0%, #30c40c 100%);
  background-image: -o-linear-gradient(top left, #30c40c 0%, #30c40c 100%);
  background-image: linear-gradient(to bottom right, #30c40c 0%, #30c40c 100%);
  box-shadow: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
}

.mood_form .mood_modal_text{
  width: 6vw;
  font-size: 1.2vw;
  font-weight:bold;
  color:#515d62;
  margin: 3.0vw 0;
  float: left;
}

/*** 排泄 ***/
.excretion_form .modal_timebox img {
  width: 23px;
  height: 23px;
}

.excretion_form .modal_timebox {
  margin-right: 30px;
}

.excretion_form .modal_textbox input[type="text"] {
  width: 100%;
}

.excretion_form .modal_radio label.excretion_normal::before {
  background-image: url("../img/ic/excretion_01.svg");
}

.excretion_form .modal_radio label.excretion_normal::after {
  content: "普通";
}

.excretion_form .modal_radio label.excretion_loose::before {
  background-image: url("../img/ic/excretion_02.svg");
}

.excretion_form .modal_radio label.excretion_loose::after {
  content: "軟便";
}

.excretion_form .modal_radio label.excretion_diarrhea::before {
  background-image: url("../img/ic/excretion_03.svg");
  background-size: 80%;
}

.excretion_form .modal_radio label.excretion_diarrhea::after {
  content: "下痢";
}

.excretion_form .modal_radio label.excretion_urine::before {
  background-image: url("../img/ic/excretion_04.svg");
  background-size: 60%;
}

.excretion_form .modal_radio label.excretion_urine::after {
  content: "尿";
}

.excretion_form .modal_radio label.excretion_vomiting::before {
  background-image: url("../img/ic/excretion_05.svg");
  background-size: 75%;
}

.excretion_form .modal_radio label.excretion_vomiting::after {
  content: "嘔吐";
}

.excretion_form .modal_radio label.excretion_hard::before {
  background-image: url("../img/ic/excretion_07.svg");
  background-size: 75%;
}

.excretion_form .modal_radio label.excretion_hard::after {
  content: "硬便";
}

/*** 検温 ***/
.thermometry_form .modal_row:first-of-type {
  margin: 50px 0;
}

.thermometry_form .modal_selectbox img,
.thermometry_form .modal_timebox img {
  width: 23px;
  height: 23px;
}

.thermometry_form .modal_timebox {
  margin-right: 30px;
}

/*** 給食 ***/
.lunch_form {
  max-height: 400px;
  overflow: auto;
}

.lunch_form.modal_contents_form{
    padding: 0 0 1.0vw;
}

.lunch_form .modal_row{
    padding: 1.0vw 0;
}

.lunch_form .title_head img {
  width: 23px;
  height: 23px;
  margin-right: 1.0em;
}

.lunch_form .title_head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.2vw;
  color: #515d62;
/*  margin-right: 0.5em;*/
}

.lunch_form .modal_row.modal_row_space_between {
  align-items: baseline;
}

.lunch_form .title_head:not(:last-child) {
  width: 15%;
}

.lunch_form .modal_row.modal_row_space_between .title_head {
  position: relative;
  top: 0.5em;
}

.lunch_form input[type="time"],
.lunch_form select {
  margin: 0;
}

.lunch_form .contents.lunch_menu .modal_row {
  padding: 0 0 1.0vw 0;
}

.lunch_form .lunch_menu {
  width: 70%;
}

.photo_select_button {
  width: 15%;
  text-align: center;
}

.lunch_form .modal_textbox {
  width: 100%;
}

.lunch_form input[type="text"] {
  width: 100%;
  height: 2.5vw;
  margin: 0;
  font-size: 1.3vw;
  background-color: #f9fcf8;
}

.lunch_form .lunch_amount-select {
  width: 100%;
  margin: 4em 4em 1em;
}

.lunch_form .switch_white {
  margin-left: 0.5em;
}

.lunch_form .modal_selectbox select {
  /* CHANGE SMO - START====================================== */
  /*width: 16.0vw;*/
  width: 17.0vw;
  /* CHANGE SMO - END======================================== */
}


/*** ミルク ***/

.milk_form.modal_contents_form{
    padding: 0 0 1.0vw;
}

.milk_form .modal_row{
    padding: 1.0vw 0;
}

.milk_form .modal_timebox img,
.milk_form .modal_amountbox img {
  width: 23px;
  height: 23px;
  margin-right: 1em;
}

.milk_form .modal_timebox,
.milk_form .modal_amountbox {
  margin-right: 30px;
  font-size: 1.2vw;
}

.milk_form input[type="time"] {
  margin-left: 2em;
}

.milk_form .milk_amount-select {
  width: 90%;
  display: block;
  margin-top: 5em;
}

/*ミルク用スライドバー*/
.milk_form .milk_amount-select-number {
  position: relative;
  display: block;
}

.milk_form .milk_amount-select-number li {
  position: absolute;
  display: block;
  top: -3em;
  color: #30c40c;
  font-size: 1.3vw;
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(1) {
  left: 1.5vw;
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(2) {
  left: calc(10% + 1.0vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(3) {
  left: calc(20% + 0.8vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(4) {
  left: calc(30% + 0.5vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(5) {
  left: calc(40% + 0.1vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(6) {
  left: 50%;
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(7) {
  left: calc(60% - 0.5vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(8) {
  left: calc(70% - 0.6vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(9) {
  left: calc(80% - 0.9vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(10) {
  left: calc(90% - 1.2vw);
  transform: translate(-50%, 0);
}

.milk_form .milk_amount-select .milk_amount-select-number li:nth-of-type(11) {
  left: calc(100% - 1.5vw);
  transform: translate(-40%, 0);
}

.milk_form .milk_amount-select-ber {
  position: relative;
  display: block;
}

.milk_form .milk_amount-select-ber li {
  position: absolute;
  display: block;
  top: -2em;
  border-left: solid 2px #efefef;
  padding: 0.5em 0;
}

/* CHANGE SMO - START====================================== */
/*.milk_form .milk_amount-select-ber li:nth-of-type(1) {*/
  /*left: 1.5vw;*/
  /*padding: 0.8em 0;*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(2) {*/
  /*left: calc(10% + 1.0vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(3) {*/
  /*left: calc(20% + 0.8vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(4) {*/
  /*left: calc(30% + 0.5vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(5) {*/
  /*left: calc(40% + 0.1vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(6) {*/
  /*left: 50%;*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(7) {*/
  /*left: calc(60% - 0.5vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(8) {*/
  /*left: calc(70% - 0.6vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(9) {*/
  /*left: calc(80% - 0.9vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(10) {*/
  /*left: calc(90% - 1.2vw);*/
/*}*/

/*.milk_form .milk_amount-select-ber li:nth-of-type(11) {*/
  /*left: calc(100% - 1.5vw);*/
  /*padding: 0.8em 0;*/
/*}*/

.milk_form .milk_amount-select-ber li:nth-of-type(1) {
  left: 1.4vw;
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(2) {
  left: calc(5% + 1.2vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(3) {
  left: calc(10% + 1.1vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(4) {
  left: calc(15% + 0.9vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(5) {
  left: calc(20% + 0.8vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(6) {
  left: calc(25% + 0.65vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(7) {
  left: calc(30% + 0.5vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(8) {
  left: calc(35% + 0.3vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(9) {
  left: calc(40% + 0.2vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(10) {
  left: calc(45% + 0.1vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(11) {
  left: 50%;
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(12) {
  left: calc(55% - 0.3vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(13) {
  left: calc(60% - 0.4vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(14) {
  left: calc(65% - 0.55vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(15) {
  left: calc(70% - 0.6vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(16) {
  left: calc(75% - 0.8vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(17) {
  left: calc(80% - 0.9vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(18) {
  left: calc(85% - 1.1vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(19) {
  left: calc(90% - 1.2vw);
  padding: 0.8em 0;
}

.milk_form .milk_amount-select-ber li:nth-of-type(20) {
  left: calc(95% - 1.35vw);
}

.milk_form .milk_amount-select-ber li:nth-of-type(21) {
  left: calc(100% - 1.5vw);
  padding: 0.8em 0;
}
/* CHANGE SMO - END======================================== */

.milk_form .amount-select-slider {
  width: 100%;
  display: block;
}

.milk_form .slider {
  -webkit-appearance: none;
  width: 100%;
}

.milk_form .slider:focus {
  outline: none;
}

.milk_form .slider::-webkit-slider-runnable-track {
  cursor: pointer;
  background: #efefef;
  border-radius: 10rem;
  height: 1.1vw;
  width: 100%;
}

.milk_form .slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: #30c40c;
  border: none;
  cursor: pointer;
  height: 3.0vw;
  margin-top: -14px;
  width: 3.0vw;
  border-radius: 50%;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15);
}

/*** 沐浴 ***/
.bathing_form .modal_row:first-of-type {
  margin: 50px 0;
}

.bathing_form .modal_timebox img {
  width: 23px;
  height: 23px;
}

.bathing_form .modal_timebox {
  margin-right: 30px;
}

/*** 子供の様子 ***/
.modal_contents_form.appearance_form{
  max-height: 600px;
  overflow: auto;
}

.appearance_form textarea {
  width: 40%;
  /* height: -webkit-fill-available; */
  height: 18.5vw;
  background-color: #f9fcf8;
  color: #515d62;
  max-height: 18.5vw;
}

.appearance_form .attention {
  color: #b0bbad;
  font-size: 1.2vw;
  margin-left: 1.0em;
}

.appearance_form .home_message {
  width: 98%;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  min-height: 80px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  padding: 1em;
  margin: auto;
}

.appearance_form .home_message p {
  color: #515d62;
  width: 100%;
  font-size: 1.2vw;
  line-height: 1.5vw;
	word-break: break-word;
  margin-top: 8px;
  max-height: 6em;
	overflow-y: auto;
	white-space: pre-wrap;
}

.appearance_form .home_message h3,
.appearance_form .nursery_message,
.appearance_form .nursery_photo {
  width: 100%;
  font-size: 1.2vw;
  letter-spacing: 0.1em;
  color: #b8c8b3;
  font-weight: normal;
}

.appearance_form .word_select_no_data {
  width: 55%;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  height: 18.5vw;
  display: flex;
  margin-right: 5px;
  overflow: auto;
  max-height: 18.5vw;
  align-items: center;
}

.appearance_form .word_select_no_data p {
  font-size: 1.2vw;
  width: 100%;
  text-align: center;
  color: #515d62;
}

.appearance_form .word_select {
  width: 55%;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  /* height: -webkit-fill-available; */
  height: 18.5vw;
  /* display: -webkit-box; */
  /* display: -webkit-flex; */
  /* display: -ms-flexbox; */
  /* display: flex; */
  /* margin-bottom: 20px; */
  /* CHANGE SMO - START====================================== */
  /* 定型文の領域が右に寄っているため、マージンを設定 */
  margin-right: 5px;
  /* CHANGE SMO - END======================================== */
  overflow: auto;
  max-height: 18.5vw;
}

.appearance_form .word_select ul {
  padding: 1em;
  display: flex;
  flex-wrap: wrap;
	width: 100%;
}

.appearance_form .word_select ul li button {
  color: #ffffff;
  background-color: #535e64;
  border: solid 2px #535e64;
  border-radius: 0.5rem;
  font-size: 1.2vw;
  padding: 0.5em 1em;
  margin: 0 0.5em 1em;
	text-align: left;
/*  white-space: nowrap;*/
	word-break: break-word;
  font-weight: bold;
}

.appearance_form .word_select ul li button.touched {
  color: #535e64;
  background-color: #ffffff;
  font-size: 1.2vw;
/*
  padding: 0.5em 1em;
  margin: 0 0 1em 1em;
*/
/*  white-space: nowrap;*/
}

.appearance_form .modal_row.modal_row_space_between:nth-of-type(3) {
  align-items: flex-start;
  padding: 0 0 1.5vw 0;
  max-height: 20.0vw;
}

.appearance_form input[type="file"] {
  width: 110px;
  color: #fff;
}

.appearance_form .appearance_photo_list {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, 152px);
  grid-gap: 25px 17px;
}

.appearance_form .appearance_photo_img {
  height: 120px;
  width: 150px;
  /* background: #000000; */
}

.appearance_form .appearance_photo_thumbnail {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  display: table;
  table-layout: fixed;
}

.appearance_form .appearance_photo_inner {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  width: 100%;
}

.appearance_form .appearance_photo_img img {
  max-width: 100%;
  max-height: 120px; /* 親の高さに合わせる */
  height: auto;
  vertical-align: bottom;
}

.appearance_form .display_contents {
  display: contents;
}

.appearance_form .btn_modal_temp {
  background-color: #fff;
  width: 200px;
  height: 40px;
  border-radius: 5px;
  border: solid 1px #0FC458;
}

.appearance_form .btn_modal_temp:disabled {
  background-color: #c4c4c4;
  width: 200px;
  height: 40px;
  border-radius: 5px;
  border: solid 1px #c4c4c4;
  color: #fff
}

.appearance_form .padding_0 {
  padding: 0;
}

.appearance_form .sign_open,
.appearance_form .sign_temp {
  display: inline-block;
  width: 7vw;
  height: 2vw;
  background-color: #30c40c;
  color: #fff;
  border-radius: 5px;
  margin-left: 1.5vw;
  text-align: center;
  line-height: 2vw;
}

.appearance_form .sign_open {
  background-color: #30c40c;
}

.appearance_form .sign_temp {
  background-color: #c4c4c4;
}

/*** 備品持参のお願い ***/
.fixtures_form p {
  font-size: 1.2vw;
  letter-spacing: 0.1em;
  color: #515d62;
}

.fixtures_form textarea {
  width: 100%;
  height: 10.0vw;
}

.fixtures_form .modal_row {
  padding: 0.5vw 0;
}


/*** 個人記録 ***/
.personal_records_form {
  max-height: 400px;
  /* CHANGE SMO - START====================================== */
  /* 個人記録の履歴を右側に表示する */
  /*overflow: auto;*/
  /* CHANGE SMO - END======================================== */
}

.personal_records_form textarea {
  width: 100%;
  height: 4.0em;
  background-color: #f9fcf8;
  color: #515d62;
}

.personal_records_form .personal_record_list {
  margin-top: 1.5vw;
}

.personal_records_form .personal_record_list li {
  width: 96%;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  min-height: 80px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin:0 auto 20px;
}

.personal_records_form .personal_record_list li .txt_area {
  width: 88%;
  font-size: 1.2vw;
  padding: 1.0em;
}

.personal_records_form .nursery_name {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 1.2rem;
}

.personal_records_form .nursery_name span.name {
  font-size: 1.2vw;
  letter-spacing: 0.1em;
  color: #b8c8b3;
  padding-left: 1.3em;
  margin-right: 1.2em;
  position: relative;
}

.personal_records_form .nursery_name span.name::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
  content: url(../img/ic/user_gray.svg);
}

.personal_records_form .nursery_message {
  color: #515d62;
  padding: 0.8em 1.0em 2.0em 1.0em;
  word-break: break-word;
}

.personal_records_form .nursery_name span.emphasis_tag {
  display: inline-block;
  color: #fff;
  background-color: #30c40c;
  padding: 0.2em 0.5em;
}

.personal_records_form .nursery_message.my_message {
  border-radius: 3px;
}

.personal_records_form .personal_record_list li .btn_area {
  width: 12%;
  border-left: 1px solid #e9e9e9;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/*** 成長記録 ***/
.growth_form .modal_row p {
  width: 35%;
  white-space: nowrap;
}

.growth_form .modal_calendar label{
  width: 13.0vw;
  margin: 0 0.5em;
}

.growth_form .modal_calendar input[type="date"] {
  opacity: 1;
  background: transparent;
  border: 1px solid rgb(48, 196, 12);
  color: #515d62;
  width: 14.0vw;
  height: 3.9vw;
  font-size: 1.6vw;
  padding: 0 0.5em;
}

.growth_form .modal_calendar input[type="date"]::-webkit-date-and-time-value {
  text-align: left;
}

.growth_form .modal_selectbox {
  display: inline-block;
  width: 300px;
  text-align: center;
}

.modal_radio.ic_button label {
  position: relative;
  display:  inline-block;
  border-radius: 0.2em;
  font-size: 1.0vw;
  font-weight: bold;
  border: solid 1px rgb(231, 231, 231);
  border-radius: 10px;
  background-image: -moz-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  background-image: -webkit-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  background-image: -ms-linear-gradient(-135deg, rgb(255, 255, 255) 0%, rgb(238, 238, 238) 100%);
  box-shadow: 0px 5px 15px 0px rgba(153, 153, 153, 0.3);
  padding: 0.5em 1em;
  color: #515d62;
  width: 6.5vw;
  height: 7.0vw;
}

/* CHANGE SMO - START====================================== */
/* 個人記録の履歴を右側に表示する */
div.kojinkiroku_wrap{
  width:100%;
}

div.kojinkiroku_wrapL{
  width:65%;
  float:left;
}

div.kojinkiroku_wrapR{
  width:35%;
  float:right;
}

div.kojinkiroku_wrapR .word_select{
  /* CHANGE SMO - START====================================== */
  /* ポップアップの幅に対して、内部の幅が大きすぎるため縮小 */
  /* width:90%; */
  width:87%;
  /* CHANGE SMO - END======================================== */
  margin:10px 20px;
  padding:10px;
  /* CHANGE SMO - START====================================== */
  /* ポップアップの高さが大きすぎるため縮小 */
  height:550px;
  /* CHANGE SMO - END======================================== */
  box-shadow:rgba(0, 0, 0, 0.18) 0px 1px 3px 0px;
  background:#fff;
  border-radius:10px;
  overflow:auto;
  display:flex;
}

div.kojinkiroku_wrapR .word_select ul li{
  margin:5px 10px;
  padding:10px;
  background:#515d62;
  border-radius:5px;
  font-size:13px;
  color:#fff;
  white-space: nowrap;
  cursor: pointer;
}
/* CHANGE SMO - START====================================== */
/* imgタグにあるSVGファイルをCSSに書き換え */

/*** 午睡モーダルアイコン　**/
.modal_nap_icon {
  width: 23px;
  height: 23px;
  background-size: cover;
}

/*** 午睡モーダル☓ボタン ***/
.close_icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1.8vw;
  height: 1.8vw;
  background-image: url(../img/ic/close.svg);
}

/*** 午睡モーダル 備考 ***/
.kid_memo_icon {
  background-image: url(../img/ic/nap_kid_memo.svg);
}

/*** 午睡モーダル 部屋選択 ***/
.nap_room_icon {
  background-image: url(../img/ic/nap_room_gray.svg);
}

/*** 午睡モーダル 室温・湿度 ***/
.temperature_humidity_form .modal_selectbox select {
  margin: 0 0.2em;
  width: 8vw;
}

.temperature_humidity_icon {
  background-image: url(../img/ic/nap_temperature_humidity.svg);
}

.clock_gereen_icon {
  background-image: url(../img/ic/clock_green.svg);
  margin-right: 0.5em;
}

.nap_temperature_icon {
  background-image: url(../img/ic/nap_temperature.svg);
  margin-right: 0.5em;
}

.nap_room_green_icon {
  background-image: url(../img/ic/nap_room_green.svg);
  margin-right: 0.5em;
}

.nap_humidity_icon {
  background-image: url(../img/ic/nap_humidity.svg);
  margin-right: 0.5em;
}
/* CHANGE SMO - END  ====================================== */

/* CHANGE SMO - START====================================== */
/* PIN入力をモーダル化 */
.modal_contents_form.pin_form {
  padding: 0;
}
/* CHANGE SMO - END  ====================================== */

/* CHANGE SMO - START====================================== */
/* 個人記録に入力可能文字残数を表示する */
div.kojinkiroku_wrap div.kojinkiroku_wrapL div.mojisuu{
  width:100%;
  text-align:right;
  font-size:1.2vw;
  /*color:#b8c8b3;*/
  color: #515d62;
}
/* CHANGE SMO - END  ====================================== */

/* 戸外遊び */
.modal_contents_form .modal_radio label.outdoor::before {
  background-image: url("../img/ic/outside_red.svg");
}

.modal_contents_form .modal_radio label.outdoor::after {
  content: "外";
}

.modal_contents_form .modal_radio label.indoor::before {
  background-image: url("../img/ic/inside_blue.svg");
}

.modal_contents_form .modal_radio label.indoor::after {
  content: "室内";
}

.outdoor_play_form .modal_textbox input[type="text"]{
  width: 70%;
}

.outdoor_play_select {
  display: flex;
  justify-content:space-around;
  padding: 1vw 10vw 3vw 10vw;
}

.outdoor_play_form p.text {
  font-size: 1.2vw;
  color: #515d62;
  font-weight: bold;
  padding-left: 5vw;
}

.outdoor_play_form p.text_reason {
  font-size: 1.2vw;
  color: #515d62;
  font-weight: bold;
}

/*与薬*/

.modal_medicine_inner{
  max-height: 45vw;
}

.medicine_form{
  display: flex;
}

.plan_medicine_select {
  display: flex;
  justify-content: space-between;
  width: 35vw;
  padding: 0 1.5em;
  margin: 0 auto 2em;
  float: left;
}

.medicine_line_block{
  border-left: 5px dotted #ddda7c
}

.result_medicine_select {
  display: flex;
  justify-content: space-between;
  width: 35vw;
  padding: 0 1.5em;
  margin: 0 auto 2em;
  float: right;
}

.medicine_time_block{
  display: block;
}

.medicine_form h2{
  display: inline-block;
  margin: 1vw 0 1vw 2vw;
  color: #515d62;
  font-size: 1.5vw;
}

.modal_medicine{
  width: 7.5vw;
}

.plan_medicine_select li.medicine_kbn{
  font-size: 1.5vw;
  margin: 3vw 1vw 0 0;
}

.result_medicine_select li.medicine_kbn{
  font-size: 1.5vw;
  margin: 3vw 1vw 0 0;
}

.medicine_form label.medicine_type_syrup::before {
  background-image: url("../img/ic/medi_syrup.svg");
}

.medicine_form label.medicine_type_syrup::after {
  content: "シロップ";
}

.medicine_form label.medicine_type_powder::before {
  background-image: url("../img/ic/medi_powder.svg");
}

.medicine_form label.medicine_type_powder::after {
  content: "粉";
}

.medicine_form label.medicine_type_ointment::before {
  background-image: url("../img/ic/medi_cream.svg");
}

.medicine_form label.medicine_type_ointment::after {
  content: "軟膏";
}

.medicine_form label.medicine_type_other::before {
  content: none;
}

.medicine_form label.medicine_type_other::after {
  content: "その他";
  height: 7.0vw;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  line-height: 7.0vw;
}

.modal_medicine .active + label {
  background-image: -webkit-linear-gradient(top left, #30c40c 0%, #30c40c 100%);
  background-image: -o-linear-gradient(top left, #30c40c 0%, #30c40c 100%);
  background-image: linear-gradient(to bottom right, #30c40c 0%, #30c40c 100%);
  box-shadow: inset 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
}

.medicine_list input[type=text] {
  transform: translate(0.5vw,0.7vw);
  border-radius: 5px;
  box-shadow: 0px 0px 8px 3px #bdbdbd;
  border: 1px solid #30c40c;
  font-size: 1.2vw;
  width: 15vw;
}

.medicine_list div.medicine_other{
  transform: translate(-55%,1vw);
  position: relative;
  margin: 0 0 0.5vw;
  background-color: #a4acb4;
  border-radius: 5px;
  width: 16vw;
  height: 3vw;
}

.medicine_list div.medicine_other::after {
  content: url(../img/ic/nap_controller_balloon_gray.svg);
  position: absolute;
  width: 20px;
  height: 20px;
  bottom: 2.65vw;
  left: 11.5vw;
}

.medicine_time_block li:nth-child(5) {
  width:7.5vw;
}

.medicine_time_block li:nth-child(4) {
  width:7.5vw;
}

.medicine_trash_list{
  margin: 2.3vw 0 0 0;
}

.medicine_time_block button.trash{
  width: 2vw;
  height: auto;
  padding: 0;
  line-height: 0;
}

.modal_medicine_half{
  display: block;
}

/*プール*/

.modal_pool_select {
  display: flex;
  justify-content: center;   /* 中央寄せ */
  align-items: center;
  gap: 2vw;                  /* ボタン間のスペース */
  padding: 2vw 0 3vw 0;            /* 左右の余白を減らす */
}

.modal_pool_select .modal_radio input[type="radio"] {
  display: none;
}

.modal_pool_select .modal_radio label {
  display: block;
  width: 15.5vw;
  height: 3vw;          /* ←ここで縦幅を狭くする */
  line-height: 2.8vw;     /* テキストを中央に */
  padding: 0;            /* パディングを0に */
  /* border: 2px solid #30c40c; */
  border-radius: 8px;
  background: #fff;
  color: #515d62;
  font-size: 2em;
  text-align: center;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  font-weight: bold;
  box-sizing: border-box;
}

.modal_pool_select .modal_radio label {
  border-color: #30c40c;
  font-size: 1.5vw;
}

.modal_pool_select .modal_radio input[type="radio"]:checked + label {
  background: #30c40c;
  color: #fff;

}

.modal_pool_form p.text {
  font-size: 1.2vw;
  color: #515d62;
  font-weight: bold;
  padding-left: 5vw;
}

.modal_pool_form p.text_pool {
  font-size: 1.2vw;
  color: #515d62;
  font-weight: bold;
  padding-left: 5.5vw;
  padding-top: 1vw;
}

.modal_pool_form .modal_textbox input[type="text"]{
  width: 70%;
  justify-content: center;
}

.modal_pool_form p.text_reason {
  font-size: 1.2vw;
  color: #515d62;
  font-weight: bold;
}

.modal_textbox.modal_row_center.text_reason {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1em; /* inputと備考の間隔 */
}

.modal_textbox.modal_row_center.text_reason input[type="text"] {
  width: 70%;
  margin: 0;
}

.bikou_label {
  white-space: nowrap;
  font-size: 1.2vw;
  margin-left: 0.5em;
}

.pool_popup_center_area {
  width: 70%;
  margin: 0 auto;
}

.modal_pool_select {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 2vw;
}

.modal_textbox_row {
  width: 100%;
  display: flex;
  align-items: center;
}

.bikou_label {
  display: inline-block;
  min-width: 5vw; /* ラベル幅を固定 */
  text-align: right;
  font-weight: bold;
  margin-right: 1em;
}

.modal_textbox_row input[type="text"] {
  width: 48%; /* ボタン1つ分と同じ幅に調整 */
  min-width: 180px;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid #30c40c;
  border-radius: 3px;
  margin: 0 1em;
  padding: 1.0em;
  font-size: 1.2vw;
}

.pool_popup_center_area {
  width: 100%;
  flex-direction: column;
  align-items: center;
}

.pool_popup_inner {
  width: 70%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.pool_popup_inner .modal_pool_select {
  width: 100%;
  justify-content: center;
  gap: 3vw;
}

.pool_popup_inner .modal_textbox_row {
  width: 77%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.pool_popup_inner .modal_textbox_row input[type="text"] {
  width: 100%;
  box-sizing: border-box;
}

.pool_popup_inner .modal_textbox_row .bikou_label {
  position: absolute;
  left: -16%;
  pointer-events: none;
  color: #515d62;
}

.pool_popup_inner {
  width: 90%; /* ここを大きくする */
  max-width: 800px; /* 必要に応じて */
  margin: 0 auto;
}

.modal_textbox_row {
  width: 100%; /* ここも100%に */
  display: flex;
  align-items: center;
}