@charset "UTF-8";
#reservation-page{width:900px;margin:0 auto;background:#eeeae6;color:#302b27;font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;padding:28px 25px 42px;box-sizing:border-box;line-height:1.8}
.reserve-hero{text-align:center;background:#f7f1e7;border-top:1px solid #b89a62;border-bottom:1px solid #b89a62;padding:28px 20px;margin-bottom:24px}.reserve-kicker{font-family:Georgia,serif;letter-spacing:.18em;font-size:11px;color:#9b7b43;margin:0}.reserve-hero h1{font-size:30px;font-weight:500;letter-spacing:.2em;color:#5d1720;margin:5px 0 8px}.reserve-hero p{margin:0;font-size:14px}
.phone-box{display:flex;align-items:center;justify-content:space-between;gap:25px;background:#fff;padding:24px 28px;border-left:5px solid #6d1721;box-shadow:0 2px 8px rgba(0,0,0,.08);margin-bottom:24px}.phone-box h2{font-size:21px;margin:0 0 4px;color:#5d1720}.phone-box p{margin:0;font-size:13px}.section-label{color:#9b7b43!important;font-size:11px!important;letter-spacing:.12em}.phone-button{display:block;min-width:285px;text-align:center;text-decoration:none!important;background:linear-gradient(#8a2632,#62131d);color:#fff!important;padding:12px 20px;border-radius:3px;box-shadow:0 2px 4px rgba(0,0,0,.2)}.phone-button span{display:block;font-size:12px}.phone-button strong{display:block;font-family:Georgia,serif;font-size:25px;letter-spacing:.04em}
.reserve-notice{background:#fffaf2;border:1px solid #d8c39b;padding:20px 25px;margin-bottom:30px}.reserve-notice h2{font-size:18px;color:#6d1721;margin:0 0 8px}.reserve-notice p{margin:0 0 8px;font-size:14px}.reserve-notice strong{color:#8a1f2c}.reserve-notice ul{margin:5px 0 0;padding-left:1.5em;font-size:13px}
.form-section{background:#fff;padding:28px 30px 34px;box-shadow:0 2px 10px rgba(0,0,0,.08)}.section-heading{text-align:center;border-bottom:1px solid #c7ad7a;padding-bottom:18px;margin-bottom:12px}.section-heading span{font-family:Georgia,serif;color:#a28249;letter-spacing:.16em;font-size:10px}.section-heading h2{font-size:23px;font-weight:500;color:#5d1720;letter-spacing:.1em;margin:2px 0}.section-heading p{font-size:12px;margin:0}.section-heading b,.form-row em{font-style:normal;background:#7a1b26;color:#fff;padding:2px 6px;font-size:10px;border-radius:2px}
.form-row{display:grid;grid-template-columns:210px 1fr;border-bottom:1px solid #e5ddd2;min-height:72px}.form-row>label{background:#f6f1e9;padding:22px 18px;font-weight:600;font-size:14px}.form-row>div{padding:16px 20px;display:flex;align-items:center;gap:8px}.form-row input[type=text],.form-row input[type=tel],.form-row input[type=email],.form-row input[type=date],.form-row input[type=number],.form-row select,.form-row textarea{width:100%;box-sizing:border-box;border:1px solid #bbb2a8;background:#fff;padding:11px 12px;font-size:16px;border-radius:3px;font-family:inherit}.form-row textarea{resize:vertical}.form-row small{display:block;font-size:11px;color:#6c625a}.form-row>div:has(small){display:block}.short-input input{max-width:130px}.short-input span{white-space:nowrap}.privacy-check{background:#f7f3ed;margin:24px 0 18px;padding:16px;text-align:center;font-size:13px}.privacy-check label{display:inline-flex;align-items:center;gap:8px}.privacy-check input{width:18px;height:18px}.privacy-check a{color:#6d1721}.submit-wrap{text-align:center}.submit-wrap button{border:0;cursor:pointer;min-width:360px;background:linear-gradient(#8a2632,#62131d);color:#fff;padding:16px 28px;font-family:inherit;font-size:17px;letter-spacing:.08em;border-radius:3px;box-shadow:0 2px 5px rgba(0,0,0,.25)}.submit-wrap button span{float:right}.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.privacy-box{background:#f7f1e7;border-top:1px solid #c7ad7a;margin-top:28px;padding:20px 25px}.privacy-box h2{font-size:17px;color:#5d1720;margin:0 0 5px}.privacy-box p{font-size:12px;margin:0}.to-top-modern{text-align:right;margin:20px 0 0}.to-top-modern a{color:#6d1721;text-decoration:none}.error-box{background:#fff1f1;border:1px solid #c66;padding:14px 18px;margin:15px 0;color:#8a1f2c}.confirm-table{width:100%;border-collapse:collapse;margin:15px 0 25px}.confirm-table th,.confirm-table td{border-bottom:1px solid #ddd3c6;padding:14px;text-align:left;vertical-align:top}.confirm-table th{width:190px;background:#f6f1e9}.button-row{display:flex;gap:15px;justify-content:center}.button-row button{min-width:240px;padding:14px;border:0;font-family:inherit;font-size:15px;cursor:pointer}.button-back{background:#ddd4c9;color:#332c27}.button-send{background:#6d1721;color:#fff}.complete-box{text-align:center;background:#fff;padding:45px 30px;box-shadow:0 2px 10px rgba(0,0,0,.08)}.complete-box h2{color:#6d1721;font-size:24px}.complete-box a{display:inline-block;margin-top:15px;background:#6d1721;color:#fff!important;text-decoration:none;padding:12px 28px}
@media screen and (min-width:768px){
/* PC：お部屋ページに近い横幅へ統一。スマホ指定には触れません。 */
#Wrapp{width:900px!important;max-width:900px!important;margin:0 auto!important;overflow:visible!important}
#head,#navi{width:770px!important;margin-left:auto!important;margin-right:auto!important}
#reservation-page{width:850px!important;max-width:850px!important;margin-left:auto!important;margin-right:auto!important}
}
@media screen and (max-width:767px){
html,body{
  width:100%!important;min-width:0!important;max-width:100%!important;
  margin:0!important;padding:0!important;overflow-x:hidden!important;
}
body{-webkit-text-size-adjust:100%!important}

#Wrapp{
  width:100%!important;min-width:0!important;max-width:100%!important;
  margin:0!important;padding:0!important;overflow:hidden!important;
  box-sizing:border-box!important;
}

/* スマホ：ヘッダーを固定幅770pxから解放 */
#head{
  position:relative!important;width:100%!important;height:auto!important;min-height:0!important;
  margin:0!important;padding:14px 14px 10px!important;box-sizing:border-box!important;
  display:block!important;overflow:visible!important;
}
#logo{
  position:relative!important;top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  float:none!important;clear:both!important;width:330px!important;max-width:88vw!important;height:82px!important;
  margin:0 auto 8px!important;padding:0!important;
  background-repeat:no-repeat!important;background-position:center center!important;background-size:contain!important;
}
#logo h1,#logo h1 a{
  position:static!important;width:100%!important;height:100%!important;min-height:0!important;
  margin:0!important;padding:0!important;display:block!important;overflow:hidden!important;
}
#head_r{
  position:static!important;width:100%!important;height:auto!important;float:none!important;clear:both!important;
  margin:0!important;padding:0!important;box-sizing:border-box!important;text-align:center!important;
}
#head_r h2{
  position:static!important;width:100%!important;height:auto!important;margin:0!important;padding:0!important;
  text-align:center!important;font-size:12px!important;line-height:1.65!important;letter-spacing:.03em!important;
  font-weight:normal!important;white-space:normal!important;
}

/* スマホ：グローバルナビを2列＋最終1列 */
#navi{
  width:100%!important;height:auto!important;margin:0!important;padding:0!important;box-sizing:border-box!important;
  background:#080808!important;border-top:1px solid #ad8797!important;border-bottom:1px solid #8f7241!important;
}
#navi ul{
  width:100%!important;height:auto!important;margin:0!important;padding:0!important;
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important;
  list-style:none!important;background:#080808!important;
}
#navi ul li{
  width:auto!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;
  float:none!important;display:block!important;border-right:1px solid rgba(220,205,175,.32)!important;
  border-bottom:1px solid rgba(220,205,175,.32)!important;background:#080808!important;
}
#navi ul li:nth-child(even){border-right:none!important}
#navi ul li:last-child{grid-column:1/-1!important;border-right:none!important;border-bottom:none!important}
#navi ul li a,#navi01,#navi02,#navi03,#navi04,#navi05,#navi06,#navi07{
  width:100%!important;height:auto!important;min-height:46px!important;margin:0!important;padding:10px 6px!important;
  box-sizing:border-box!important;float:none!important;display:flex!important;align-items:center!important;
  justify-content:center!important;background-image:none!important;
  background:linear-gradient(to bottom,#5f002d 0%,#210014 42%,#050505 100%)!important;
  border:none!important;border-radius:0!important;text-indent:0!important;white-space:normal!important;
  text-align:center!important;color:#f7f2e8!important;text-decoration:none!important;text-shadow:0 1px 2px #000!important;
  font-size:15px!important;line-height:1.25!important;letter-spacing:.08em!important;
}

/* スマホ：予約本文 */
#reservation-page{
  width:100%!important;min-width:0!important;max-width:100%!important;
  margin:0!important;padding:14px 12px 28px!important;box-sizing:border-box!important;overflow:hidden!important;
}
.reserve-hero{padding:22px 12px}
.reserve-hero h1{font-size:25px}
.pc-only{display:none}
.phone-box{display:block;padding:18px}
.phone-button{min-width:0;width:100%;margin-top:15px;box-sizing:border-box}
.form-section{padding:18px 12px 25px}
.form-row{display:block;min-height:0}
.form-row>label{display:block;padding:11px 12px}
.form-row>div{padding:12px;display:block}
.form-row input[type=text],.form-row input[type=tel],.form-row input[type=email],
.form-row input[type=date],.form-row input[type=number],.form-row select,.form-row textarea{
  max-width:100%!important;min-width:0!important;
}
.form-row small{margin-top:5px}
.short-input{display:flex!important;align-items:center;gap:8px}
.submit-wrap button{min-width:0;width:100%}
.confirm-table,.confirm-table tbody,.confirm-table tr,.confirm-table th,.confirm-table td{
  display:block;width:100%!important;max-width:100%!important;box-sizing:border-box;
}
.confirm-table th{padding:9px 12px}
.confirm-table td{padding:11px 12px;overflow-wrap:anywhere}
.button-row{display:block}
.button-row button{width:100%;min-width:0;margin:5px 0}
.privacy-check{text-align:left}
.reserve-notice{padding:16px}
.complete-box{padding:30px 16px}
#footer{
  width:100%!important;max-width:100%!important;height:auto!important;min-height:34px!important;
  margin:0!important;padding:10px 8px!important;box-sizing:border-box!important;text-align:center!important;
  font-size:10px!important;line-height:1.5!important;
}
}



/* =========================================================
   2026-09-17 ご予約ページ
   お料理／仕出し／お部屋 共通仕様 + PC本文730px
   予約フォームの機能指定には触れない
   ========================================================= */

/* ---------- PC：共通幅 ---------- */
@media screen and (min-width:768px){
  #Wrapp{
    width:770px !important;
    max-width:770px !important;
    margin:0 auto !important;
    overflow:visible !important;
  }
  #head,#navi{
    width:770px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  #reservation-page{
    width:730px !important;
    max-width:730px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:24px 0 36px !important;
  }
}

/* ---------- グローバルナビ：確定済み共通仕様 ---------- */
#navi{
  background:#f4efe6 !important;
  border-top:1px solid #c9bca8 !important;
  border-bottom:1px solid #b9aa94 !important;
}
#navi ul{background:#f4efe6 !important;}
#navi ul li{
  background:#f4efe6 !important;
  border-right:1px solid #d8cdbc !important;
  border-bottom:0 !important;
}
#navi ul li a,
#navi01,#navi02,#navi03,#navi04,#navi05,#navi06,#navi07{
  background:linear-gradient(to bottom,#fbf8f1 0%,#e8e0d3 100%) !important;
  background-image:none !important;
  color:#55483f !important;
  text-shadow:none !important;
  border:0 !important;
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP","MS PMincho",serif !important;
  letter-spacing:.05em !important;
}
#navi ul li a:hover,
#navi ul li a:focus,
#navi ul li a#navi06{
  background:linear-gradient(to bottom,#c8b79f 0%,#aa967b 100%) !important;
  color:#fffaf1 !important;
}

/* ---------- 予約ページ：グレージュ／金茶へ統一 ---------- */
#reservation-page{
  background:#eeeae6;
  color:#352b26;
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP","MS PMincho",serif;
}

.reserve-hero{
  background:#fbf8f1;
  border:1px solid #b6a58d;
  border-left:4px solid #8b6a43;
  padding:24px 20px;
  margin-bottom:22px;
  box-shadow:0 2px 6px rgba(54,38,27,.10);
}
.reserve-kicker{color:#9a7d57;}
.reserve-hero h1{
  color:#4a342b;
  font-size:27px;
  font-weight:normal;
  letter-spacing:.16em;
  margin:5px 0 8px;
}

/* 電話予約 */
.phone-box{
  background:#fffdf9;
  border:1px solid #d8cdbf;
  border-left:4px solid #8b6a43;
  padding:22px 24px;
  margin-bottom:22px;
  box-shadow:0 2px 6px rgba(54,38,27,.10);
}
.phone-box h2{color:#4a342b;font-weight:normal;}
.section-label{color:#9a7d57 !important;}
.phone-button{
  background:linear-gradient(to bottom,#b9a384 0%,#947b5d 100%);
  border:1px solid #a88d69;
  color:#fffdf8 !important;
  box-shadow:0 2px 5px rgba(57,44,34,.18);
}
.phone-button:hover,.phone-button:focus{
  background:linear-gradient(to bottom,#a99172 0%,#80684e 100%);
}

/* Web予約の注意 */
.reserve-notice{
  background:#fffdf9;
  border:1px solid #d8c39b;
  border-left:4px solid #b6a06f;
  padding:20px 22px;
  margin-bottom:24px;
}
.reserve-notice h2{color:#4a342b;font-weight:normal;}
.reserve-notice strong{color:#765f45;}

/* フォーム本体 */
.form-section{
  background:#fff;
  padding:26px 24px 30px;
  box-shadow:0 2px 8px rgba(54,38,27,.10);
  border:1px solid #ddd3c7;
}
.section-heading{
  border-bottom:1px solid #c7ad7a;
  padding-bottom:16px;
}
.section-heading span{color:#9a7d57;}
.section-heading h2{
  color:#4a342b;
  font-weight:normal;
}
.section-heading b,.form-row em{
  background:#9b8568;
  color:#fff;
  border-radius:2px;
}
.form-row{
  grid-template-columns:180px 1fr;
  border-bottom:1px solid #e5ddd2;
}
.form-row>label{
  background:#f6f1e9;
  color:#44372f;
  padding:20px 16px;
}
.form-row>div{padding:14px 16px;}
.form-row input[type=text],
.form-row input[type=tel],
.form-row input[type=email],
.form-row input[type=date],
.form-row input[type=number],
.form-row select,
.form-row textarea{
  border:1px solid #bdb2a5;
  background:#fff;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus{
  outline:2px solid rgba(168,141,105,.25);
  border-color:#a88d69;
}

/* 個人情報・送信ボタン */
.privacy-check{
  background:#f7f3ed;
  border:1px solid #ded4c8;
}
.privacy-check a{color:#765f45;}
.submit-wrap button{
  min-width:360px;
  background:linear-gradient(to bottom,#b9a384 0%,#947b5d 100%);
  border:1px solid #a88d69;
  color:#fffdf8;
  box-shadow:0 2px 5px rgba(57,44,34,.18);
}
.submit-wrap button:hover,
.submit-wrap button:focus{
  background:linear-gradient(to bottom,#a99172 0%,#80684e 100%);
}

/* 個人情報説明 */
.privacy-box{
  background:#fbf8f1;
  border:1px solid #d8cdbf;
  border-left:4px solid #8b6a43;
  margin-top:24px;
  padding:18px 22px;
}
.privacy-box h2{color:#4a342b;font-weight:normal;}

/* 古い上部へリンクは使わない */
.to-top-modern{display:none !important;}

/* 確認・完了画面も同系色 */
.confirm-table th{background:#f6f1e9;}
.button-back{background:#ddd4c9;color:#332c27;}
.button-send,
.complete-box a{
  background:linear-gradient(to bottom,#b9a384 0%,#947b5d 100%);
  color:#fff !important;
}
.complete-box h2{color:#4a342b;}

/* ---------- スマホ：確定済みグレージュナビへ ---------- */
@media screen and (max-width:767px){
  #navi,#navi ul,#navi ul li{background:#f4efe6 !important;}
  #navi ul li{
    border-right:1px solid #d4c8b7 !important;
    border-bottom:1px solid #d4c8b7 !important;
  }
  #navi ul li a,
  #navi01,#navi02,#navi03,#navi04,#navi05,#navi06,#navi07{
    background:linear-gradient(to bottom,#fbf8f1 0%,#e7dfd2 100%) !important;
    color:#55483f !important;
    text-shadow:none !important;
  }
  #navi ul li a#navi06{
    background:linear-gradient(to bottom,#c8b79f 0%,#aa967b 100%) !important;
    color:#fffaf1 !important;
  }

  #reservation-page{
    background:#eeeae6 !important;
    padding:14px 12px 28px !important;
  }
  .reserve-hero{padding:20px 12px;}
  .reserve-hero h1{font-size:24px;}
  .phone-box{padding:18px;}
  .form-section{padding:18px 12px 25px;}
  .form-row>label{background:#f6f1e9;}
  .submit-wrap button{min-width:0;width:100%;}
}


/* ---------- ご予約ページ ヘッダー写真 ---------- */
#reservation-sub-hero{
  width:730px;
  height:120px;
  margin:0 auto;
  padding:0;
  overflow:hidden;
  background:#000;
}
#reservation-sub-hero img{
  display:block;
  width:730px;
  height:120px;
  margin:0;
  object-fit:cover;
}

@media screen and (max-width:767px){
  #reservation-sub-hero{
    width:100% !important;
    height:auto !important;
    margin:0 !important;
  }
  #reservation-sub-hero img{
    width:100% !important;
    height:auto !important;
  }
}
