/* CSS Document */

.admin_login_msg{
  color: #4D547B;
  font-size: 14px;
  font-weight: 400;
  line-height: 175%; /* 24.5px */
}

.btn_blue{
  display: flex;
  width: 100%;
  height: 48px;
  padding: 8px;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  border-radius: 6px;
  background: var(--logo, #5666BE);
  border: none;
  color: #FFF;
  color: #FFF;
  font-size: 16px;
  font-weight: 500;
  line-height: 150%; /* 24px */
}

.container h3{
  font-size: 24px;
  font-weight: 700;
}

.container h3.center{
  text-align: center;
}

.container blockquote small{
  display: block;
  margin-top: 10px;
  color: var(--gray, #4D547B);
  font-size: 14px;
  font-weight: 400;
}

.sys_msg,
.sys_error{
  width: 100%;
  max-width: 1064px;
  margin: 16px auto 0;
  display: flex;
  padding: 16px 24px;
  align-items: flex-start;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
  background: #E6E9FB;
  color: #5666BE;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}

.sys_error{
  border:solid 1px #c81b1b ;
  background-color: #fdefef ;
  color: #c81b1b;
}

/* login
------------------------------------------------------------*/

.container_login{
  width: 412px;
  margin: 80px auto 0;
  border-radius: 8px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  box-shadow: 0 2px 6px 0 rgba(36, 47, 105, 0.10);
  padding: 44px 38px;
  margin-bottom: 80px;
}

.container_login.mt_min{
  margin-top: 30px;
}

.container_login h1{
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 30px;
}

.container_login .form-group{
  margin-bottom: 24px;
}

.container_login .form-group .control-label{
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 8px;
  display: block;
}

.container_login .form-group .form-control{
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  font-size: 16px;
  height: 52px;
  padding: 16px;
  width: 100%;
}


.container_login .form-group .btn{
  margin-top: 10px;
}

.container_login .pass_forgot{
  margin-top: 30px;
  color: #B3B3B3;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
}

@media screen and (max-width: 768px) {
}

/*login------------------------------------------------------------*/

/* 注文
------------------------------------------------------------*/
.interval_area{
  margin-top: 33px;
}

.interval_area .wish_list{
  width: 100%;
  border-radius: 8px 8px 0 0;
  border-collapse: separate;
  border-spacing: 0;  /* セルの余計な隙間をなくす */
  overflow: hidden;    /* はみ出るthやtdの角をカットする（最重要） */
}

.interval_area .wish_list th{
  padding: 12px 16px;
  background: var(--logo, #5666BE);
  border-right: solid 1px #FFF;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  color: #FFF;
}


/* 週ごとの期間（例：9月14日(月) ～ 9月18日(金)） */
.interval_area .week_title{
  margin: 30px 0 13px;
  font-size: 15px;
  font-weight: 500;
}

/* 最初の週は上の余白なし */
.interval_area .week_title:first-child{
  margin-top: 0;
}

.interval_area .wish_list th:last-child{
  border-right: none;
}

.interval_area .wish_list tr th:nth-child(1),
.interval_area .wish_list tr th:nth-child(2){
  width: 110px;
}
.interval_area .wish_list tr th:nth-child(3),
.interval_area .wish_list tr th:nth-child(4){
  width: 302px;
}

.interval_area .wish_list tr td{
  border-bottom: 1px solid #F3F4FB;
  background: #FFF;
  padding: 16px 10px 16px 16px;
  font-size: 14px;
}

.interval_area .wish_list tr:last-child td{
  border-bottom: none;
}

.interval_area .wish_list tr td:nth-child(1){
  font-weight: 700;
}

.interval_area .wish_list tr td.setmeal ul li,
.interval_area .wish_list tr td.pasta ul li {
  text-indent: -1em;
  padding-left: 1em;
}

.interval_area .wish_list tr td.selects span,
.interval_area .wish_list tr td.orderstop span{
  display: inline-block;
  color: #4D547B;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%; /* 19.5px */
  border-radius: 999px;
  border: 1px solid #E5E5E5;
  background:#F3F4FB;
  padding: 6px 8px;
}

.interval_area .wish_list tr td.selects span.setmeal,
.interval_area .wish_list tr td.selects span.pasta{
  width: 71px;
  text-align: center;
  color: #399D46;
  border: none;
  background: #EFFFEA;
}

.interval_area .wish_list tr td.selects span.pasta{
  color: #A97400;
  background: #FFF6C1;
}

.btn-group {
  display: flex;
  gap: 4px;
}

.btn-group .btn {
  position: relative;
  display: inline-block;
  min-width: 60px;
  padding: 8px 12px;
  border: 1px solid #A6A7B3;
  border-radius: 4px;
  background: #fff;
  color: #4D547B;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  user-select: none;
  font-size: 14px;
}

/* ラジオ本体は非表示（キーボード操作は残す） */
.btn-group .btn input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* 選択中 */
.btn-group .btn:has(input:checked) {
  color: #5666BE;
  border: 1px solid #5666BE;
  background: #E6E9FB;
}
.btn-group .btn.setmeal:has(input:checked) {
  color: #399D46;
  border: 1px solid #399D46;
  background: #EFFFEA;
}
.btn-group .btn.pasta:has(input:checked) {
  color: #A97400;
  border: 1px solid #A97400;
  background: #FFF6C1;
}

.form-actions{
  margin-top: 30px;
  display: flex;
  justify-content: right;
}

.form-actions .btn-default,
.form-actions .btn-success{
  width: 206px;
  height: 46px;
  border-radius: 6px;
  border: none;
  font-size: 15px;
  color: #000;
  font-weight: 500;
}

.form-actions .btn-default{
  border-radius: 6px;
  border: 1px solid var(--gray_20, #E5E5E5);
  background: var(--white, #FFF);
  margin-right: 8px;
}

.form-actions .btn-success{
  background: #5666BE;
  color: #FFF;
}

@media screen and (max-width: 768px) {
}

/*注文------------------------------------------------------------*/

/* 予約
------------------------------------------------------------*/
.now_reservation{
  margin-top: 20px;
  background: #FFF;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  padding: 16px 24px;
}

.now_reservation p{
  color: #4D547B;
  font-size: 18px;
  font-weight: 700;
  line-height: 100%; /* 18px */
}

.now_reservation p span{
  display: block;
  color: #000;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 13px;
}

.now_reservation .form-actions{
  justify-content: left;
  margin-top: 16px;
}

.now_reservation.now_reservation2{
  background: none;
  border-color: #E5E5E5;
}

.now_reservation.now_reservation2 ul.txt li{
  font-size: 14px;
  font-weight: 400;
  text-indent: -1em;
  padding-left: 1em;
}

.now_reservation.now_reservation2 ul.txt li span{
  color: #5666BE;
  font-weight: 700;
}

.now_reservation.now_reservation2 .caution{
  margin-top: 16px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FDF7E4;
  padding: 16px 24px;
}

.now_reservation.now_reservation2 .caution p{
  color: #000;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 15px;
}

.now_reservation.now_reservation2 .caution ul li{
  color: #4D547B;
  font-size: 14px;
  font-weight: 400;
  line-height: 175%; /* 24.5px */
  text-indent: -1em;
  padding-left: 1em;
}

@media screen and (max-width: 768px) {
}

/*予約------------------------------------------------------------*/

/* クーポン
------------------------------------------------------------*/

.coupon .container-fluid fieldset{
  display: flex;
  justify-content: space-between;
  border: none;
  margin-top: 25px;
  border-top: solid 1px #D9D9D9;
  padding: 30px 0;
}

.coupon .container-fluid fieldset .form-group-l{
  width: 350px;
}

.coupon .container-fluid fieldset .form-group-l .txt01{
  font-size: 20px;
  font-weight: 700;
  line-height: 150%; /* 30px */
  margin-bottom: 10px;
}

.coupon .container-fluid fieldset .form-group-l .txt02{
  color: #4D547B;
  font-size: 14px;
  font-weight: 400;
}

.coupon .container-fluid fieldset .form-group-r{
  width: 600px;
}

.coupon .container-fluid fieldset .form-group-r .control-label{
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
  padding: 16px 24px;
  color: #5666BE;
  font-size: 16px;
  font-weight: 500;
  line-height: 100%; /* 16px */
  margin-bottom: 7px;
}

.coupon .container-fluid fieldset .form-group-r .control-label.finish{
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background:  #F3F4FB;
  color: #4D547B;
}

@media screen and (max-width: 768px) {
  /* 左（クーポンの説明）の下に、右（利用状況）を縦積みにする */
  .coupon .container-fluid fieldset{
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
    padding: 20px 0;
  }
  .coupon .container-fluid fieldset .form-group-l,
  .coupon .container-fluid fieldset .form-group-r{
    width: 100%;
  }
  .coupon .container-fluid fieldset .form-group-l .txt01{
    font-size: 18px;
    margin-bottom: 6px;
  }
  .coupon .container-fluid fieldset .form-group-l .txt02{
    font-size: 13px;
  }

  /* 「#1 利用済（2026年10月5日）」などが長くて折り返しても、行が重ならないようにする */
  .coupon .container-fluid fieldset .form-group-r .control-label{
    width: 100%;
    padding: 14px 16px;
    font-size: 15px;
    line-height: 1.4;
  }
}

/*/クーポン------------------------------------------------------------*/

/* パスワード変更
------------------------------------------------------------*/

.container_login.pass{
  width: 440px;
  margin: 30px auto 0;
  border-radius: 0;
  border: none;
  background: none;
  box-shadow: none ;
  padding: 0;
}


.container_login.pass .caution{
  color: #4D547B;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
  margin-top: 5px;
}

.container blockquote .complete{
  color: #4D547B;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 175%; /* 24.5px */
  margin-top: 10px;
}

.container blockquote .complete a{
  color: #5666BE;
  text-decoration-line: underline;
}

.container blockquote .complete a:hover{
  text-decoration: none;
}

@media screen and (max-width: 768px) {
}

/*パスワード変更------------------------------------------------------------*/

/* 休日登録 admin
------------------------------------------------------------*/

.hollyday_add{
  margin-top: 18px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
  padding: 16px 24px;
}

.hollyday_add h4{
  font-size: 14px;
  font-weight: 500;
  line-height: 100%; /* 14px */
  margin-bottom: 15px;
}

.hollyday_add p{
  color: #4D547B;
  font-size: 14px;
  font-weight: 400;
  line-height: 175%; /* 24.5px */
  margin-bottom: 15px;
}

.hollyday_add .input_area{
  display: flex;
  justify-content: space-between;
}

.hollyday_add .input_area button{
  border-radius: 6px;
  background: #5666BE;
  display: flex;
  width: 206px;
  height: 46px;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%; /* 22.5px */
  border: none;
  justify-content: center;
  align-items: center;
}

.hollyday_add .input_area input {
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  font-size: 16px;
  font-weight: 400;
  padding: 16px;
  height: 46px;
  width: calc(100% - 222px);
}

#holidays_list{
  margin-top: 16px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
  padding: 16px 24px;
  margin-bottom: 80px;
}

#holidays_list h5{
  font-size: 14px;
  font-weight: 500;
  line-height: 100%;
  margin: 0 0 16px;
}

/* 年のタブ */
#holidays_list .holiday_tabs{
  display: flex;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid #E5E5E5;
}

#holidays_list .holiday_tab{
  width: 160px;
  padding: 12px 0;
  border: none;
  border-bottom: 4px solid #E5E5E5;
  background: none;
  color: #000;
  font-size: 14px;
  font-weight: 700;
  line-height: 150%;
  cursor: pointer;
}

#holidays_list .holiday_tab.active{
  color: #5666BE;
  border-bottom-color: #5666BE;
}

/* 年ごとの一覧（activeの年だけ表示） */
#holidays_list .holiday_year{
  display: none;
}

#holidays_list .holiday_year.active{
  display: block;
}

/* 月ごとのブロック */
#holidays_list .holiday_month{
  margin-bottom: 16px;
}

#holidays_list .holiday_month:last-child{
  margin-bottom: 0;
}

#holidays_list .holiday_month_title{
  font-size: 14px;
  font-weight: 500;
  line-height: 100%;
  margin: 0 0 10px;
}

/* 日付のボタン */
#holidays_list .holiday_days{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#holidays_list .holiday_days .btn{
  min-width: 136px;
  padding: 12px 24px;
  border-radius: 6px;
  border: 1px solid #E5E5E5;
  background: #FFF;
  color: #4D547B;
  font-size: 15px;
  line-height: 150%;
}

#holidays_list .holiday_days .btn:hover{
  border-color: #5666BE;
  color: #5666BE;
}

#holidays_list .holiday_empty{
  color: #4D547B;
  font-size: 14px;
  margin: 0;
}

@media screen and (max-width: 768px) {
  #holidays_list{
    padding: 16px;
  }
  #holidays_list .holiday_tab{
    width: auto;
    flex: 1;
  }
  #holidays_list .holiday_days .btn{
    min-width: calc(50% - 4px);
  }
}

@media screen and (max-width: 768px) {
}

/* 削除確認モーダル */
.holiday_modal{
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1050;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.holiday_modal.is-open{
  display: flex;
}

.holiday_modal_bg{
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}

.holiday_modal_box{
  position: relative;
  width: 100%;
  max-width: 400px;
  border-radius: 8px;
  background: #FFF;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.holiday_modal_header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid #E5E5E5;
}

.holiday_modal_title{
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 150%;
}

.holiday_modal_x{
  border: none;
  background: none;
  color: #A6A7B3;
  font-size: 24px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}

.holiday_modal_x:hover{
  color: #4D547B;
}

.holiday_modal_body{
  padding: 20px 24px;
}

.holiday_modal_body p{
  margin: 0;
  color: #4D547B;
  font-size: 18px;
  font-weight: 500;
  line-height: 150%;
}

.holiday_modal_footer{
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 24px 20px;
  border-top: 1px solid #E5E5E5;
}

.holiday_modal_cancel,
.holiday_modal_delete{
  min-width: 96px;
  height: 42px;
  padding: 0 20px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}

.holiday_modal_cancel{
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
}

.holiday_modal_cancel:hover{
  background: #F3F4FB;
}

.holiday_modal_delete{
  border: none;
  background: #5666BE;
  color: #FFF;
}

.holiday_modal_delete:hover{
  opacity: 0.85;
}

/* モーダル表示中は後ろのページをスクロールさせない */
body.is-modal-open{
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  .holiday_modal_footer .holiday_modal_cancel,
  .holiday_modal_footer .holiday_modal_delete{
    flex: 1;
  }
}

/*休日登録 admin------------------------------------------------------------*/


/* ユーザ管理 admin
------------------------------------------------------------*/

/* 新規登録ボタンと凡例 */
.user_toolbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.user_add_btn{
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 206px;
  height: 46px;
  padding: 0 24px;
  border: none;
  border-radius: 6px;
  background: #5666BE;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%;
  cursor: pointer;
}

.user_add_btn:hover{
  opacity: 0.85;
}

.user_legend{
  display: flex;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #4D547B;
  font-size: 13px;
}

.user_legend li{
  display: flex;
  align-items: center;
  gap: 6px;
}

.user_legend_mark{
  width: 14px;
  height: 14px;
  border-radius: 3px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.user_legend_mark.is-leave{
  border-color: #A97400;
  background: #FFF6C1;
}

.user_legend_mark.is-retired{
  border: 1px dashed #A6A7B3;
  background: #F3F4FB;
}

/* 一覧全体 */
#user_list{
  margin-top: 42px;
}

/* BASEごとのカード */
.user_group{
  margin-bottom: 16px;
  padding: 16px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.user_group_title{
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  line-height: 150%;
}

.user_group_title span{
  color: #A6A7B3;
  font-size: 12px;
  font-weight: 400;
}

/* 名前のボタン */
.user_chips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.user_chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border-radius: 6px;
  border: 1px solid #E5E5E5;
  background: #FFF;
  color: #4D547B;
  font-size: 15px;
  line-height: 150%;
  cursor: pointer;
}

.user_chip:hover{
  border-color: #5666BE;
  color: #5666BE;
}

/* 休職 */
.user_chip.is-leave{
  border-color: #A97400;
  background: #FFF6C1;
  color: #A97400;
}

/* 退職 */
.user_chip.is-retired{
  border: 1px dashed #A6A7B3;
  background: #F3F4FB;
  color: #A6A7B3;
}

.user_chip.is-leave:hover,
.user_chip.is-retired:hover{
  border-color: #5666BE;
  color: #5666BE;
}

/* 名前の後ろのラベル */
.user_tag{
  padding: 1px 6px;
  border-radius: 4px;
  background: #F3F4FB;
  color: #4D547B;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}

.user_tag.is-admin{
  background: #E6E9FB;
  color: #5666BE;
}

.user_empty{
  padding: 16px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
  color: #4D547B;
  font-size: 14px;
  margin: 0;
}

@media screen and (max-width: 768px) {
  .user_add_btn{
    width: 100%;
  }
  .user_group{
    padding: 16px;
  }
}

/* 編集モーダル */
.user_modal{
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1050;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.user_modal.is-open{
  display: flex;
}

.user_modal_bg{
  position: absolute;
  inset: 0;
  background: rgba(77, 84, 123, 0.5);
}

.user_modal_box{
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 560px;
  max-height: calc(100vh - 32px);
  border-radius: 8px;
  background: #FFF;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.user_modal_box form{
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin: 0;
}

.user_modal_header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid #E5E5E5;
}

.user_modal_title{
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 150%;
}

.user_modal_x{
  border: none;
  background: none;
  color: #A6A7B3;
  font-size: 24px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}

.user_modal_x:hover{
  color: #4D547B;
}

/* 項目が多いので、中身だけスクロールさせる */
.user_modal_body{
  overflow-y: auto;
  padding: 20px 24px;
}

.user_modal_footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 16px 24px 20px;
  border-top: 1px solid #E5E5E5;
}

.user_modal_actions{
  display: flex;
  gap: 8px;
}

.user_modal_cancel,
.user_modal_save,
.user_modal_delete{
  min-width: 96px;
  height: 42px;
  padding: 0 20px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}

.user_modal_cancel{
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
}

.user_modal_cancel:hover{
  background: #F3F4FB;
}

.user_modal_save{
  border: none;
  background: #5666BE;
  color: #FFF;
}

.user_modal_save:hover{
  opacity: 0.85;
}

.user_modal_delete{
  border: 1px solid #c81b1b;
  background: #FFF;
  color: #c81b1b;
}

.user_modal_delete:hover{
  background: #fdefef;
}

/* 退職者以外は押せない */
.user_modal_delete:disabled{
  border-color: #E5E5E5;
  background: #FFF;
  color: #D2D4E6;
  cursor: not-allowed;
}

/* フォームの項目 */
.user_field{
  margin-bottom: 16px;
}

.user_field:last-child{
  margin-bottom: 0;
}

.user_field.is-hidden{
  display: none;
}

.user_field_row{
  display: flex;
  gap: 16px;
}

.user_field_row .user_field{
  flex: 1;
}

.user_field_label{
  display: block;
  margin: 0 0 6px;
  color: #000;
  font-size: 13px;
  font-weight: 500;
  line-height: 150%;
}

.user_input{
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #000;
  font-size: 15px;
}

.user_input:focus{
  outline: none;
  border-color: #5666BE;
  box-shadow: 0 0 0 3px #E6E9FB;
}

.user_field_help{
  margin: 6px 0 0;
  color: #A6A7B3;
  font-size: 12px;
  line-height: 160%;
}

/* ラジオボタン（選択中のものを青くする） */
.user_seg{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.user_seg label{
  margin: 0;
  cursor: pointer;
}

.user_seg input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.user_seg span{
  display: inline-block;
  padding: 8px 14px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
  font-size: 14px;
  line-height: 150%;
}

.user_seg label:hover span{
  border-color: #5666BE;
}

.user_seg input:checked + span{
  border-color: #5666BE;
  background: #E6E9FB;
  color: #5666BE;
  font-weight: 700;
}

.user_seg input:focus-visible + span{
  box-shadow: 0 0 0 3px #E6E9FB;
}

@media screen and (max-width: 768px) {
  .user_field_row{
    flex-direction: column;
    gap: 0;
  }
  .user_field_row .user_field{
    margin-bottom: 16px;
  }
  .user_modal_footer{
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .user_modal_actions .user_modal_cancel,
  .user_modal_actions .user_modal_save{
    flex: 1;
  }
}

@media screen and (max-width: 768px) {

}

/*ユーザ管理 admin------------------------------------------------------------*/


/* クーポン登録 admin
------------------------------------------------------------*/

/* 登録する日付の注意書き */
.coupon_entry_note{
  margin: 16px 0 0;
  padding: 12px 16px;
  border-radius: 6px;
  border: 1px solid #A97400;
  background: #FFF6C1;
  color: #A97400;
  font-size: 13px;
  font-weight: 500;
  line-height: 160%;
}

.coupon_entry{
  margin-top: 16px;
}

/* Enterキー用の見えない登録ボタン（display:noneにするとEnterで押されないので画面外に置く） */
.coupon_default_submit{
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* クーポンごとのカード */
.coupon_card{
  margin-bottom: 16px;
  padding: 16px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.coupon_card_head{
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #F3F4FB;
}

.coupon_card_title{
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 700;
  line-height: 150%;
}

.coupon_card_title span{
  color: #5666BE;
  font-size: 13px;
  font-weight: 500;
}

.coupon_card_sub{
  margin: 0;
  color: #4D547B;
  font-size: 13px;
  line-height: 160%;
}

/* 1枚ごとの行 */
.coupon_rows{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.coupon_row{
  display: flex;
  align-items: center;
  gap: 12px;
}

.coupon_row_no{
  flex: 0 0 32px;
  color: #A6A7B3;
  font-size: 13px;
  font-weight: 700;
}

.coupon_row_input{
  flex: 1;
  min-width: 0;
}

.coupon_row_action{
  flex: 0 0 110px;
  text-align: right;
}

/* 日付の入力欄 */
.coupon_input{
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #000;
  font-size: 15px;
  cursor: pointer;
}

.coupon_input:focus{
  outline: none;
  border-color: #5666BE;
  box-shadow: 0 0 0 3px #E6E9FB;
}

/* 利用済みの行 */
.coupon_row.is-used .coupon_input,
.coupon_row.is-used .coupon_row_text{
  border: 1px solid #E5E5E5;
  background: #F3F4FB;
  color: #4D547B;
  cursor: default;
}

.coupon_row_text{
  display: flex;
  align-items: center;
  height: 42px;
  margin: 0;
  padding: 0 12px;
  border-radius: 6px;
  font-size: 15px;
}

.coupon_row_note{
  margin: 0;
  padding-left: 44px;
  color: #A6A7B3;
  font-size: 13px;
  line-height: 160%;
}

/* キャンセルボタン（誕生日クーポンは btn btn-default のまま出力されるので button 全体に当てる） */
.coupon_row_action button{
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #c81b1b;
  background: #FFF;
  color: #c81b1b;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}

.coupon_row_action button:hover{
  background: #fdefef;
}

/* 下部のボタン */
.coupon_actions{
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 8px 0 32px;
}

.coupon_back_btn,
.coupon_submit_btn{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 24px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%;
  text-decoration: none;
  cursor: pointer;
}

.coupon_back_btn{
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
}

.coupon_back_btn:hover{
  background: #F3F4FB;
  color: #4D547B;
  text-decoration: none;
}

.coupon_submit_btn{
  min-width: 206px;
  border: none;
  background: #5666BE;
  color: #FFF;
}

.coupon_submit_btn:hover{
  opacity: 0.85;
}

@media screen and (max-width: 768px) {
  .coupon_card{
    padding: 16px;
  }
  .coupon_row{
    flex-wrap: wrap;
    gap: 8px;
  }
  .coupon_row_no{
    flex-basis: 100%;
  }
  .coupon_row_action{
    flex-basis: 96px;
  }
  .coupon_row_action:empty{
    display: none;
  }
  .coupon_row_note{
    padding-left: 0;
  }
  .coupon_actions{
    flex-direction: column-reverse;
  }
  .coupon_submit_btn{
    min-width: 0;
  }
}

/*クーポン登録 admin------------------------------------------------------------*/


/* CSV出力 admin
------------------------------------------------------------*/

/* フォームごとのカード */
.csv_card{
  display: block;
  margin-top: 16px;
  padding: 16px 24px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.csv_card_head{
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #F3F4FB;
}

.csv_card_title{
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 700;
  line-height: 150%;
}

.csv_card_sub{
  margin: 0;
  color: #4D547B;
  font-size: 13px;
  line-height: 160%;
}

/* 月・期の選択 */
.csv_field{
  max-width: 400px;
  margin-bottom: 16px;
}

.csv_label{
  display: block;
  margin: 0 0 6px;
  color: #000;
  font-size: 13px;
  font-weight: 500;
  line-height: 150%;
}

.csv_select{
  width: 100%;
  height: 46px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #000;
  font-size: 15px;
  cursor: pointer;
}

.csv_select:focus{
  outline: none;
  border-color: #5666BE;
  box-shadow: 0 0 0 3px #E6E9FB;
}


/* 月（期）と拠点の選択を横に並べる */
.csv_fields{
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}

.csv_fields .csv_field{
  flex: 0 1 320px;
  max-width: none;
  margin-bottom: 0;
}

/* 出力ボタン */
.csv_buttons{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 8px;
}

.csv_btn{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 14px 16px;
  border: none;
  border-radius: 6px;
  background: #5666BE;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  line-height: 150%;
  text-align: left;
  cursor: pointer;
}

.csv_btn small{
  color: #E6E9FB;
  font-size: 12px;
  font-weight: 400;
  line-height: 150%;
}

.csv_btn:hover{
  opacity: 0.85;
}

@media screen and (max-width: 768px) {
  .csv_card{
    padding: 16px;
  }
  .csv_field{
    max-width: none;
  }
  .csv_buttons{
    grid-template-columns: 1fr;
  }
}

/*CSV出力 admin------------------------------------------------------------*/


/* アルシエロ 月別注文状況
------------------------------------------------------------*/

/* ナビの印刷ボタン */
.print_btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: center;
  height: 40px;
  padding: 0 16px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}

.print_btn:hover{
  border-color: #5666BE;
  color: #5666BE;
}

/* 月の選択 */
.order_month_form{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
  padding: 16px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.order_month_label{
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}

.order_month_select{
  width: 220px;
  height: 46px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #000;
  font-size: 15px;
  cursor: pointer;
}

.order_month_select:focus{
  outline: none;
  border-color: #5666BE;
  box-shadow: 0 0 0 3px #E6E9FB;
}

.order_month_btn{
  height: 46px;
  padding: 0 24px;
  border: none;
  border-radius: 6px;
  background: #5666BE;
  color: #FFF;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}

.order_month_btn:hover{
  opacity: 0.85;
}

/* 注文状況の表 */
.order_table_card{
  margin: 16px 0 32px;
  padding: 16px 24px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.order_table_title{
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 150%;
}

.order_table_title span{
  color: #A6A7B3;
  font-size: 12px;
  font-weight: 400;
}

.order_table_wrap{
  overflow-x: auto;
}

.order_table{
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.order_table th,
.order_table td{
  padding: 10px 12px;
  border-bottom: 1px solid #F3F4FB;
  text-align: left;
  white-space: nowrap;
}

.order_table thead th{
  border-bottom: 2px solid #E5E5E5;
  color: #4D547B;
  font-size: 13px;
  font-weight: 700;
}

.order_table .order_table_date{
  width: 25%;
}

.order_table .order_table_num{
  width: 15%;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.order_table tbody tr:hover{
  background: #F3F4FB;
}

/* 締切り済み */
.order_table tr.is-closed{
  background: #F8F9FD;
}

/* 今日 */
.order_table tr.is-today,
.order_table tr.is-today:hover{
  background: #FFF6C1;
}

.order_table tr.is-today .order_table_date{
  font-weight: 700;
}

/* 休日・定休日 */
.order_table tr.is-holiday,
.order_table tr.is-holiday:hover{
  background: #F3F4FB;
  color: #A6A7B3;
}

/* 合計行 */
.order_table tfoot th,
.order_table tfoot td{
  border-top: 2px solid #E5E5E5;
  border-bottom: none;
  background: #E6E9FB;
  color: #5666BE;
  font-size: 15px;
  font-weight: 700;
}

/* 登録・締めのラベル */
.order_badge{
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  background: #EFFFEA;
  color: #399D46;
  font-size: 12px;
  font-weight: 500;
  line-height: 150%;
}

.order_badge.is-closed{
  background: #E6E9FB;
  color: #5666BE;
}

.order_badge.is-none{
  background: #FDEFEF;
  color: #c81b1b;
}

@media screen and (max-width: 768px) {
  .order_month_form,
  .order_table_card{
    padding: 16px;
  }
  .order_month_select{
    flex: 1;
    width: auto;
  }
}

/* 印刷時はナビ・月の選択・登録と締めの列を隠して、表だけを出す */
@media print {
  nav,
  .no_print{
    display: none !important;
  }
  .order_table_card{
    margin: 0;
    padding: 0;
    border: none;
  }
  .order_table th,
  .order_table td{
    padding: 6px 8px;
    border-bottom: 1px solid #D2D4E6;
  }
  .order_table tr.is-holiday,
  .order_table tr.is-today,
  .order_table tfoot th{
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/*アルシエロ 月別注文状況------------------------------------------------------------*/


/* アルシエロ メニュー登録
------------------------------------------------------------*/

/* 印刷時だけ表示するもの（画面では隠す） */
.print_only{
  display: none;
}

/* 説明の箇条書き */
.menu_guide{
  margin: 16px 0 0;
  padding: 12px 16px;
  list-style: none;
  border-radius: 6px;
  background: #F3F4FB;
  color: #4D547B;
  font-size: 13px;
  line-height: 170%;
}

.menu_guide strong{
  display: inline-block;
  min-width: 110px;
  color: #000;
  font-weight: 700;
}

/* 週の選択は選択肢が長いので広めにする */
.order_month_select.menu_week_select{
  width: 320px;
}

/* 入力表 */
.menu_table_card{
  display: block;
  margin: 16px 0 32px;
  padding: 16px 24px 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

.menu_table_wrap{
  overflow-x: auto;
}

.menu_table{
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 14px;
}

.menu_table th,
.menu_table td{
  padding: 12px;
  border-bottom: 1px solid #F3F4FB;
  text-align: left;
  vertical-align: top;
}

.menu_table thead th{
  border-bottom: 2px solid #E5E5E5;
  color: #4D547B;
  font-size: 13px;
  font-weight: 700;
}

.menu_table .menu_table_date{
  width: 16%;
  padding-top: 22px;
  font-weight: 700;
  white-space: nowrap;
}

.menu_table thead .menu_table_date{
  padding-top: 12px;
}

.menu_table .menu_table_deadline{
  width: 18%;
}

.menu_table .menu_table_menu{
  width: 33%;
}

/* 休日・定休日の行 */
.menu_table tr.is-holiday td{
  height: 64px;
  vertical-align: middle;
  background: #F3F4FB;
  color: #A6A7B3;
}

.menu_table tr.is-holiday .menu_table_date{
  padding-top: 12px;
}

/* 締切り日とメニューの入力欄 */
.menu_input,
.menu_textarea{
  width: 100%;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #000;
  font-size: 14px;
}

.menu_input{
  height: 42px;
  padding: 0 12px;
  cursor: pointer;
}

.menu_textarea{
  min-height: 104px;
  padding: 10px 12px;
  line-height: 160%;
  resize: vertical;
}

.menu_input:focus,
.menu_textarea:focus{
  outline: none;
  border-color: #5666BE;
  box-shadow: 0 0 0 3px #E6E9FB;
}

.menu_table .print_only{
  margin: 0;
  line-height: 170%;
}

/* 下部のボタン */
.menu_actions{
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

.menu_reset_btn,
.menu_submit_btn{
  height: 46px;
  padding: 0 24px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}

.menu_reset_btn{
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
}

.menu_reset_btn:hover{
  background: #F3F4FB;
}

.menu_submit_btn{
  min-width: 206px;
  border: none;
  background: #5666BE;
  color: #FFF;
}

.menu_submit_btn:hover{
  opacity: 0.85;
}

@media screen and (max-width: 768px) {
  .menu_table_card{
    padding: 16px;
  }
  .menu_guide strong{
    display: block;
  }
  .order_month_select.menu_week_select{
    width: auto;
  }
  .menu_actions{
    flex-direction: column-reverse;
  }
}

/* 印刷時は入力欄を消して、メニューの文字だけの表にする */
@media print {
  .print_only{
    display: block;
  }
  .menu_print_title{
    margin: 0 0 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #D2D4E6;
    font-size: 18px;
  }
  .menu_table_card{
    margin: 0;
    padding: 0;
    border: none;
  }
  .menu_table{
    min-width: 0;
  }
  .menu_table th,
  .menu_table td{
    padding: 8px;
    border-bottom: 1px solid #D2D4E6;
  }
  .menu_table .menu_table_date{
    width: 20%;
    padding-top: 8px;
  }
  .menu_table .menu_table_menu{
    width: 40%;
  }
  .menu_table tr.is-holiday td{
    height: auto;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/*アルシエロ メニュー登録------------------------------------------------------------*/


/* アルシエロ 当日の確認
------------------------------------------------------------*/

.modify_date_input{
  cursor: pointer;
}

/* 見出しと合計 */
.modify_title{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 24px 0 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 150%;
}

.modify_sum{
  display: flex;
  gap: 8px;
}

.modify_sum_item{
  padding: 4px 12px;
  border-radius: 6px;
  background: #E6E9FB;
  color: #5666BE;
  font-size: 13px;
  font-weight: 500;
}

.modify_sum_item strong{
  margin-left: 4px;
  font-size: 16px;
}

/* 左右2列の一覧 */
.modify_list{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}

.modify_col{
  padding: 8px 16px 12px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  background: #FFF;
}

/* 1人分の行（見出し行も同じ並び） */
.modify_head,
.modify_row{
  display: grid;
  grid-template-columns: 28px 1fr 84px 196px;
  align-items: center;
  gap: 8px;
  padding: 8px 4px;
  border-bottom: 1px solid #F3F4FB;
}

.modify_head{
  border-bottom: 2px solid #E5E5E5;
  color: #4D547B;
  font-size: 12px;
  font-weight: 700;
}

.modify_row:last-child{
  border-bottom: none;
}

.modify_kana{
  color: #5666BE;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}

.modify_name{
  font-size: 14px;
  font-weight: 500;
}

.modify_order{
  color: #4D547B;
  font-size: 12px;
  line-height: 140%;
}

/* 当日変更あり */
.modify_row.is-changed{
  background: #FFF6C1;
}

.modify_row.is-changed .modify_order{
  color: #A97400;
  font-weight: 700;
}

/* 休職など */
.modify_row.is-inactive{
  color: #A6A7B3;
}

.modify_row.is-inactive .modify_name{
  color: #A6A7B3;
}

/* 東京BASEの区切り */
.modify_divider{
  margin: 16px 0 4px;
  padding: 6px 8px;
  border-radius: 4px;
  background: #F3F4FB;
  color: #4D547B;
  font-size: 12px;
  font-weight: 700;
}

/* 定食・パスタ・なしの切り替え */
.modify_seg{
  display: flex;
  gap: 4px;
  margin: 0;
  padding: 0;
  border: none;
  min-width: 0;
}

.modify_seg label{
  flex: 1;
  margin: 0;
  cursor: pointer;
}

.modify_seg input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.modify_seg span{
  display: block;
  padding: 6px 0;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
  font-size: 13px;
  text-align: center;
  line-height: 150%;
}

.modify_seg label:hover span{
  border-color: #5666BE;
}

.modify_seg input:checked + span{
  border-color: #5666BE;
  background: #5666BE;
  color: #FFF;
  font-weight: 700;
}

.modify_seg input:focus-visible + span{
  box-shadow: 0 0 0 3px #E6E9FB;
}

/* 休職などで押せないとき */
.modify_seg:disabled label{
  cursor: not-allowed;
}

.modify_seg:disabled span,
.modify_seg:disabled label:hover span{
  border-color: #E5E5E5;
  background: #F3F4FB;
  color: #A6A7B3;
}

.modify_seg:disabled input:checked + span{
  border-color: #D2D4E6;
  background: #D2D4E6;
  color: #FFF;
}

@media screen and (max-width: 992px) {
  .modify_list{
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 768px) {
  .modify_head,
  .modify_row{
    grid-template-columns: 24px 1fr 172px;
  }
  .modify_head .modify_order,
  .modify_row .modify_order{
    display: none;
  }
}

/* 印刷時は左右2列のまま、注文した種類に丸を付ける */
@media print {
  .modify_title{
    margin: 0 0 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #D2D4E6;
    font-size: 18px;
  }
  .modify_sum_item{
    background: none;
    padding: 0;
    color: #000;
  }
  .modify_list{
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
  .modify_col{
    padding: 0;
    border: none;
  }
  .modify_row{
    grid-template-columns: 24px 1fr auto;
    padding: 6px 0;
    border-bottom: 1px solid #D2D4E6;
    break-inside: avoid;
  }
  .modify_row.is-changed{
    background: none;
  }
  .modify_print{
    font-size: 12px;
  }
  .modify_print > span{
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #A6A7B3;
  }
  .modify_print > span.onMenu{
    border-color: #000;
    color: #000;
    font-weight: 700;
  }
}

/*アルシエロ 当日の確認------------------------------------------------------------*/


/* 今日の注文
------------------------------------------------------------*/

nav .container-fluid #navbar .navbar-nav li a{
  padding: 0 24px;
}

/* 注文カード */
.today_card{
  max-width: 560px;
  margin: 18px auto 0;
  padding: 24px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  border-top: 6px solid #A6A7B3;
  background: #FFF;
  text-align: center;
}

.today_date{
  margin: 0;
  color: #4D547B;
  font-size: 15px;
  font-weight: 700;
}

.today_name{
  margin: 4px 0 0;
  color: #A6A7B3;
  font-size: 13px;
}

/* 注文の種類（一番大きく出す） */
.today_type{
  display: inline-block;
  margin: 16px 0 0;
  padding: 12px 40px;
  border-radius: 8px;
  background: #F3F4FB;
  color: #4D547B;
  font-size: 32px;
  font-weight: 700;
  line-height: 140%;
}

/* 定食 */
.today_card.is-lunch{
  border-top-color: #399D46;
}

.today_card.is-lunch .today_type{
  background: #EFFFEA;
  color: #399D46;
}

/* パスタ */
.today_card.is-pasta{
  border-top-color: #A97400;
}

.today_card.is-pasta .today_type{
  background: #FFF6C1;
  color: #A97400;
}

/* 注文なし・提供なし */
.today_card.is-none .today_type,
.today_card.is-closed .today_type{
  font-size: 20px;
  color: #A6A7B3;
}

.today_card.is-closed .today_type{
  display: block;
  padding: 24px 16px;
}

/* 当日変更あり */
.today_change{
  display: inline-block;
  margin: 12px 0 0;
  padding: 4px 12px;
  border-radius: 4px;
  background: #FDEFEF;
  color: #c81b1b;
  font-size: 13px;
  font-weight: 700;
}

/* 今日のメニュー */
.today_menu{
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #F3F4FB;
  text-align: left;
}

.today_menu_title{
  margin: 0 0 8px;
  color: #4D547B;
  font-size: 13px;
  font-weight: 700;
}

.today_menu ul{
  margin: 0;
  padding-left: 1.2em;
  color: #000;
  font-size: 15px;
  line-height: 180%;
}

/* 注文画面へのリンク */
.today_actions{
  max-width: 560px;
  margin: 16px auto 32px;
  text-align: center;
}

.today_link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 24px;
  border-radius: 6px;
  border: 1px solid #D2D4E6;
  background: #FFF;
  color: #4D547B;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

.today_link:hover{
  background: #F3F4FB;
  color: #4D547B;
  text-decoration: none;
}

@media screen and (max-width: 768px) {
  .today_card{
    padding: 20px 16px;
  }
  .today_type{
    display: block;
    padding: 16px;
    font-size: 28px;
  }
}

/*今日の注文------------------------------------------------------------*/

/* キャンセル済み */
.today_card.is-canceled{
  border-top-color: #c81b1b;
}

.today_card.is-canceled .today_type{
  background: #FDEFEF;
  color: #c81b1b;
}

.today_before{
  margin: 8px 0 0;
  color: #A6A7B3;
  font-size: 13px;
}

/* キャンセル・取り消しのボタン（ボタン自体の見た目は「当日キャンセル」のセクションの .cancel_btn） */
.today_cancel{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #F3F4FB;
}

.today_cancel .cancel_btn{
  min-width: 200px;
  height: 42px;
  font-size: 14px;
}

/* 当日キャンセル（order.php）
------------------------------------------------------------*/

/* 締切り後の日の注文欄 */
.order_cancel{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}

/* 注文の状態（定食・パスタ・なし・キャンセル済） */
.order_status{
  display: inline-block;
  color: #4D547B;
  font-size: 14px;
  font-weight: 700;
}

.order_status.is-canceled{
  padding: 2px 10px;
  border-radius: 4px;
  background: #FDEFEF;
  color: #c81b1b;
}


/* 定食 */
.interval_area .wish_list tr td.selects span.order_status.setmeal{
  border-color: #399D46;
  background: #EFFFEA;
  color: #399D46;
}

/* パスタ */
.interval_area .wish_list tr td.selects span.order_status.pasta{
  border-color: #A97400;
  background: #FFF6C1;
  color: #A97400;
}

/* キャンセル済 */
.interval_area .wish_list tr td.selects span.order_status.is-canceled{
  border-color: #c81b1b;
  background: #FDEFEF;
  color: #c81b1b;
}

/* キャンセルする */
.cancel_btn{
  height: 36px;
  padding: 0 14px;
  border-radius: 6px;
  border: 1px solid #c81b1b;
  background: #FFF;
  color: #c81b1b;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.cancel_btn:hover{
  background: #FDEFEF;
}

/* キャンセルを取り消す */
.cancel_btn.is-restore{
  border-color: #5666BE;
  color: #5666BE;
}

.cancel_btn.is-restore:hover{
  background: #E6E9FB;
}

.cancel_note{
  color: #A6A7B3;
  font-size: 11px;
  line-height: 150%;
}

/*当日キャンセル------------------------------------------------------------*/


/* 曜日ごとの予約注文（order_reservation.php）
------------------------------------------------------------*/

.reserve_week{
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 12px;
}

/* 1曜日分の行 */
.reserve_week_row{
  display: flex;
  align-items: center;
  gap: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #F3F4FB;
}

.reserve_week_day{
  flex: 0 0 72px;
  color: #000;
  font-size: 15px;
  font-weight: 700;
}

.reserve_week_note{
  margin: 0;
  color: #A6A7B3;
  font-size: 12px;
  line-height: 160%;
}

@media screen and (max-width: 768px) {
  .reserve_week_row{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/*曜日ごとの予約注文------------------------------------------------------------*/

/* CSVの休日（画面からは削除できない） */
#holidays_list .holiday_days .btn.is-csv{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 8px 16px;
  background: #F3F4FB;
  cursor: default;
}

#holidays_list .holiday_days .btn.is-csv:hover{
  border-color: #E5E5E5;
  color: #4D547B;
}

#holidays_list .holiday_days .btn.is-csv em{
  color: #A6A7B3;
  font-size: 11px;
  font-style: normal;
  line-height: 140%;
}


/* TOP
------------------------------------------------------------*/


/* 「注文」列のラベル（admin/modify.php）
   order.php の注文欄（.interval_area .wish_list tr td.selects span.order_status）と同じ見た目 */
.modify_order{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

/* ※「当日キャンセル」のセクションの .order_status の指定より優先させるため、.modify_row から書いている */
.modify_row .modify_order .order_status{
  display: inline-block;
  max-width: 100%;
  padding: 5px 8px;
  border-radius: 999px;
  border: 1px solid #E5E5E5;
  background: #F3F4FB;
  color: #4D547B;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
  white-space: nowrap;
}

/* 定食 */
.modify_row .modify_order .order_status.setmeal{
  padding-left: 16px;
  padding-right: 16px;
  border: none;
  background: #EFFFEA;
  color: #399D46;
}

/* パスタ */
.modify_row .modify_order .order_status.pasta{
  padding-left: 16px;
  padding-right: 16px;
  border: none;
  background: #FFF6C1;
  color: #A97400;
}

/* キャンセル済 */
.modify_row .modify_order .order_status.is-canceled{
  padding-left: 6px;
  padding-right: 6px;
  border-color: #c81b1b;
  background: #FDEFEF;
  color: #c81b1b;
}

/* 元の注文（当日に変更・キャンセルされた人） */
.modify_order .order_status_before{
  color: #A6A7B3;
  font-size: 11px;
  line-height: 140%;
}


/* 一覧の中のキャンセル・取り消しボタン（admin/modify.php） */
.modify_seg .cancel_btn{
  flex: 1;
  height: 32px;
  padding: 0 8px;
  font-size: 12px;
  white-space: nowrap;
}

/* 管理画面のナビが5項目になったので、メニュー全体の幅を中身に合わせる（アルシエロのナビは対象外） */
nav .container-fluid #navbar.admin:not(.alcielo) .navbar-nav:not(.navbar-right){
  width: auto;
}

nav .container-fluid #navbar.admin:not(.alcielo) .navbar-nav li:nth-child(n+4){
  width: auto;
}

nav .container-fluid #navbar.admin:not(.alcielo) .navbar-nav li:nth-child(n+4) a{
  padding: 0 16px;
}


@media screen and (max-width: 768px) {
}

/*TOP------------------------------------------------------------*/


/* Googleログイン（index.php）
------------------------------------------------------------*/

.google_login_lead{
  margin: 0 0 24px;
  color: #4D547B;
  font-size: 14px;
  line-height: 170%;
  text-align: center;
}

/* Googleのボタンの見た目のルールに合わせて、白地・グレーの枠線・Gのマーク付きにする */
.google_login_btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border-radius: 6px;
  border: 1px solid #747775;
  background: #FFF;
  color: #1F1F1F;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.google_login_btn:hover,
.google_login_btn:focus{
  background: #F8F9FD;
  box-shadow: 0 1px 3px rgba(60, 64, 67, 0.3);
  color: #1F1F1F;
  text-decoration: none;
}

.google_login_icon{
  flex: 0 0 20px;
}

/*Googleログイン------------------------------------------------------------*/

/*スマホスクロール------------------------------------------------------------*/
/* 注文画面（order.php）の表：スマホでは1日ずつ縦積みにする
   左に見出し（日付・注文締切・定食・パスタ・注文）、右に中身 */
@media screen and (max-width: 768px) {
  .interval_area .wish_list{
    display: block;
    border-radius: 0;
    overflow: visible;
  }
  .interval_area .wish_list thead{
    display: none;
  }
  .interval_area .wish_list tbody,
  .interval_area .wish_list tr,
  .interval_area .wish_list tr td{
    display: block;
    width: 100%;
  }

  /* 1日分 = 1枚のカード */
  .interval_area .wish_list tr{
    margin-bottom: 12px;
    border-radius: 8px;
    overflow: hidden;
  }
  .interval_area .wish_list tr:last-child{
    margin-bottom: 0;
  }

  /* 左に見出しの帯、右に中身 */
  .interval_area .wish_list tr td{
    position: relative;
    min-height: 44px;
    padding: 12px 12px 12px 96px;
    background: linear-gradient(to right, var(--logo, #5666BE) 84px, #FFF 84px);
    border-bottom: 1px solid #F3F4FB;
  }
  .interval_area .wish_list tr td:last-child,
  .interval_area .wish_list tr:last-child td:last-child{
    border-bottom: none;
  }
  .interval_area .wish_list tr td::before{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 84px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-bottom: 1px solid #FFF;
    font-size: 12px;
    font-weight: 500;
    color: #FFF;
  }
  .interval_area .wish_list tr td.date::before{      content: "日付"; }
  .interval_area .wish_list tr td.orderstop::before{ content: "注文締切"; }
  .interval_area .wish_list tr td.setmeal::before{   content: "定食"; }
  .interval_area .wish_list tr td.pasta::before{     content: "パスタ"; }
  .interval_area .wish_list tr td.selects::before{   content: "注文"; }

  /* 休日の行：空の「注文締切」「注文」は出さない */
  .interval_area .wish_list tr:has(td[colspan]) td.orderstop,
  .interval_area .wish_list tr:has(td[colspan]) td.selects{
    display: none;
  }
  .interval_area .wish_list tr td[colspan]::before{
    content: "メニュー";
  }

  /* なし・定食・パスタのボタンが入りきらないときは折り返す */
  .interval_area .wish_list tr td.selects .btn-group{
    flex-wrap: wrap;
  }
}

/*/スマホスクロール------------------------------------------------------------*/