:root{
  --peach:#FFDEC9;
  --brown:#B08076;
  --green:#0FAA40;
  --ink:#333;
  --white:#fff;
  --f-en:"Taviraj", serif;
  --f-jp:"toppan-bunkyu-gothic","Toppan Bunkyu Gothic","Zen Kaku Gothic New", sans-serif;
  --f-mincho:"toppan-bunkyu-mincho","Shippori Mincho","Yu Mincho","YuMincho","Hiragino Mincho ProN",serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--f-jp);color:var(--ink);background:var(--white);
  line-height:1.9;font-weight:400;font-size:14px;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block;}
p,h1,h2,h3,label{line-break:strict;word-break:normal;overflow-wrap:anywhere;}
a{color:inherit;text-decoration:none;}

/* header */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 20px;
  background:rgba(255,222,201,.55);
  -webkit-backdrop-filter:blur(12px) saturate(140%);
  backdrop-filter:blur(12px) saturate(140%);
}
.logo{display:flex;align-items:center;}
.logo img{height:44px;width:auto;display:block;}
.burger{
  background:none;border:none;cursor:pointer;padding:6px;
  display:flex;flex-direction:column;gap:3.5px;z-index:102;position:relative;
}
.burger i{display:block;width:19px;height:2.5px;background:#434343;border-radius:1px;transition:.3s;}

/* drawer */
.drawer{
  position:fixed;top:0;right:-78%;width:78%;max-width:320px;height:100dvh;
  background:var(--white);z-index:101;
  padding:60px 0 40px 28px;
  transition:right .42s cubic-bezier(.4,0,.2,1);
  box-shadow:-6px 0 24px rgba(0,0,0,.06);
}
.drawer.open{right:0;}
.drawer .close{
  position:absolute;top:16px;right:18px;
  background:#eee;border:none;width:30px;height:30px;border-radius:4px;
  font-size:17px;cursor:pointer;line-height:1;
}
.drawer ul{list-style:none;display:flex;flex-direction:column;gap:20px;}
.drawer a{
  font-family:var(--f-en);font-weight:600;font-size:17px;letter-spacing:.06em;
  display:flex;align-items:center;gap:12px;
}
.drawer a::before{content:"";width:5px;height:20px;background:#FFE44D;flex:none;}
.mask{
  position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:99;
  opacity:0;pointer-events:none;transition:opacity .35s;
}
.mask.on{opacity:1;pointer-events:auto;}

/* page head */
.page-head{
  padding:120px 22px 40px;
  background:#fff;
  text-align:left;position:relative;
}
.page-head h1{
  font-family:var(--f-en);font-weight:600;color:var(--brown);
  font-size:32px;letter-spacing:0;line-height:1.2;margin-bottom:14px;
}
.page-head .sub{
  color:var(--brown);font-family:var(--f-mincho);
  font-size:13px;font-weight:400;line-height:2;
}

/* form */
.form-wrap{padding:60px 22px 90px;}
.intro{font-size:13px;line-height:1.95;margin-bottom:34px;color:#444;}
form{display:flex;flex-direction:column;gap:22px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{
  font-size:12.5px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:8px;
}
.field .req{
  background:var(--brown);color:#fff;font-size:9.5px;font-weight:500;
  padding:2px 7px;border-radius:2px;letter-spacing:.05em;
}
.field .opt{
  background:#eee;color:#666;font-size:9.5px;font-weight:500;
  padding:2px 7px;border-radius:2px;letter-spacing:.05em;
}
.field input,.field select,.field textarea{
  font-family:var(--f-jp);font-size:14px;color:var(--ink);
  padding:12px 14px;border:1px solid #DDD;border-radius:4px;
  background:#fff;width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--brown);
}
.field textarea{min-height:150px;resize:vertical;line-height:1.7;}
.field .note{font-size:11px;color:#888;line-height:1.6;}
.submit{margin-top:14px;text-align:center;}
.submit button{
  background:var(--green);color:#fff;border:none;cursor:pointer;
  padding:14px 44px;border-radius:10px;font-size:13.5px;font-weight:700;
  font-family:var(--f-jp);letter-spacing:.03em;
  transition:opacity .25s;
}
.submit button:hover{opacity:.85;}

/* Contact Form 7 の出力に合わせる */
.wpcf7{margin:0;}
.wpcf7 form{display:flex;flex-direction:column;gap:22px;}
/* CF7は入力欄をspanで包むので、幅を親いっぱいに広げる */
.field .wpcf7-form-control-wrap{display:block;width:100%;}
/* 送信ボタンはbuttonではなくinputで出力される */
.submit input[type="submit"]{
  background:var(--green);color:#fff;border:none;cursor:pointer;
  padding:14px 44px;border-radius:10px;font-size:13.5px;font-weight:700;
  font-family:var(--f-jp);letter-spacing:.03em;
  transition:opacity .25s;
  -webkit-appearance:none;appearance:none;
}
.submit input[type="submit"]:hover{opacity:.85;}
.submit input[type="submit"]:disabled{opacity:.5;cursor:default;}
/* 入力エラーの注意書き */
.wpcf7-not-valid-tip{
  font-size:11.5px;line-height:1.7;color:#D93025;margin-top:6px;display:block;
}
.field input.wpcf7-not-valid,
.field select.wpcf7-not-valid,
.field textarea.wpcf7-not-valid{border-color:#D93025;}
/* 送信後のメッセージ */
.wpcf7-response-output{
  margin:24px 0 0;padding:14px 16px;border:1px solid #DDD;border-radius:6px;
  font-size:12.5px;line-height:1.85;
}
.wpcf7 form.sent .wpcf7-response-output{
  border-color:var(--green);background:#F3FBF6;color:#12793a;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output{
  border-color:#E0A33E;background:#FFFAF1;color:#8A6420;
}
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output{
  border-color:#D93025;background:#FEF4F3;color:#B32218;
}
/* 送信中のぐるぐる
   CF7がJSでボタンの直後に差し込むspan。見えないのに幅24px＋左右マージン24pxを取り、
   送信ボタンが72px左にずれる。ボタンの下に回して中央に戻す。 */
.submit .wpcf7-spinner{display:block;margin:12px auto 0;}

.direct{
  margin-top:44px;padding:24px 22px;border-radius:6px;
  background:#F9F6F1;text-align:center;
}
.direct p{font-size:12px;line-height:1.85;color:#666;}
.direct .mail{
  display:inline-block;margin-top:8px;font-family:var(--f-en);font-weight:600;
  font-size:15px;color:var(--brown);letter-spacing:.02em;
}
.direct .hours{margin-top:14px;padding-top:13px;border-top:1px solid #EDE6DC;}
/* 左揃えのかたまりを中央に置く。「営業日」「定休日」とも3文字なので縦線がそろう */
.direct .hours p{
  display:inline-block;text-align:left;
  font-size:11.5px;line-height:1.9;color:#8a8078;
}

/* footer */
footer{padding:36px 22px;text-align:center;font-size:10.5px;color:#888;}
footer .sns{display:flex;justify-content:center;gap:16px;margin-bottom:16px;}
footer .sns a{color:var(--brown);display:block;transition:opacity .25s;}
footer .sns a:hover{opacity:.6;}
footer .sns svg{width:auto;height:21px;display:block;}
footer .fl{display:flex;justify-content:center;align-items:center;margin-bottom:12px;}
footer .fl .logo-footer{height:40px;width:auto;display:block;}

@media(min-width:760px){
  .page-head{padding:150px 8vw 60px;}
  .page-head h1{font-size:36px;}
  .page-head .sub{font-size:14px;}
  .form-wrap{padding:40px 8vw 110px;max-width:800px;margin:0 auto;}
  .intro{font-size:14px;}
}