@charset "UTF-8";

/* =============================================
   common02.css
   スコープ: #home02
   common.css の競合を避けた独立スタイル
   ============================================= */

/*===============================
reset
================================*/
*,
*:before,
*:after {
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 text-align: justify;
 word-break: break-all;
}

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
 margin: 0;
 padding: 0;
 border: 0;
 vertical-align: baseline;
 font-size: 100%;
}

body {
 line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
 display: block;
}

button {
 padding: 0;
 background: transparent;
 border: none;
 outline: none;
}

nav ul {
 list-style: none;
}

ol,
ul {
 list-style: none;
}

a {
 margin: 0;
 padding: 0;
 color: #333;
 font-size: 100%;
 vertical-align: baseline;
 background: transparent;
 text-decoration: none;
}

img {
 max-width: 100%;
 height: auto;
 vertical-align: middle;
}

blockquote,
q {
 quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
 content: "";
 content: none;
}

table,
td,
th {
 border-collapse: collapse;
 border-spacing: 0;
}

input,
button,
select,
textarea {
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 background: transparent;
 border: none;
 border-radius: 0;
 font: inherit;
 outline: none;
}

textarea {
 resize: vertical;
}

input[type="checkbox"],
input[type="radio"] {
 display: none;
}

input[type="submit"],
input[type="button"],
label,
button,
select {
 cursor: pointer;
}

select::-ms-expand {
 display: none;
}

.palmtop {
 display: block !important;
}
@media screen and (min-width: 768px) {
 .palmtop {
  display: none !important;
 }
}

.laptop {
 display: none !important;
}
@media screen and (min-width: 768px) {
 .laptop {
  display: block !important;
 }
}

/* ===== Reset (scoped) ===== */
#home02 *,
#home02 *::before,
#home02 *::after {
 box-sizing: border-box;
 word-break: break-word;
}

#home02 img {
 max-width: 100%;
 display: block;
 vertical-align: middle;
}

#home02 a {
 color: inherit;
 text-decoration: none;
}

#home02 ul,
#home02 ol {
 list-style: none;
 margin: 0;
 padding: 0;
}

/* ===== Body / Base ===== */
#home02 {
 font-family: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
 color: #1c2024;
 background: #f7f4ee;
 line-height: 1.9;
 -webkit-font-smoothing: antialiased;
 letter-spacing: 0.02em;
 /* 微細ノイズ */
 position: relative;
}

#home02::before {
 content: "";
 position: fixed;
 inset: 0;
 pointer-events: none;
 z-index: 9999;
 opacity: 0.03;
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== Wrap ===== */
#home02 .wrap02 {
 width: min(1180px, 90vw);
 margin-inline: auto;
}

/* ===== Header ===== */
#home02 .hd02 {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 z-index: 200;
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 18px clamp(20px, 4vw, 46px);
 transition:
  background 0.4s,
  backdrop-filter 0.4s;
}

#home02 .hd02--scrolled {
 background: rgba(247, 244, 238, 0.88);
 backdrop-filter: blur(12px);
 border-bottom: 1px solid rgba(28, 32, 36, 0.12);
}

#home02 .hd02__logo {
 height: 55px;
}

#home02 .hd02__logo img {
 height: 100%;
 width: auto;
}

#home02 .hd02--scrolled .hd02__logo img {
 filter: invert(1);
}

#home02 .hd02__nav ul {
 display: flex;
 gap: clamp(14px, 2vw, 30px);
 align-items: center;
 font-size: 13px;
 font-family: "Cormorant", serif;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 color: #fff;
}

#home02 .hd02--scrolled .hd02__nav ul {
 color: #1c2024;
}

#home02 .hd02__nav__res {
 border: 1px solid #fff;
 border-radius: 999px;
 padding: 8px 18px;
 transition: 0.3s;
}

#home02 .hd02--scrolled .hd02__nav__res {
 border-color: #1c2024;
}

#home02 .hd02__nav__res:hover {
 background: #fff;
 color: #1c2024;
}

#home02 .hd02--scrolled .hd02__nav__res:hover {
 background: #1c2024;
 color: #fff;
}

#home02 .hd02__burger {
 display: none;
 flex-direction: column;
 gap: 5px;
 background: none;
 border: none;
 cursor: pointer;
 padding: 6px;
}

#home02 .hd02__burger span {
 display: block;
 width: 24px;
 height: 2px;
 background: #fff;
 transition: background 0.3s;
}

#home02 .hd02--scrolled .hd02__burger span {
 background: #1c2024;
}

/* ===== Drawer ===== */
#home02 .drawer02 {
 position: fixed;
 top: 0;
 right: -100%;
 width: min(320px, 100vw);
 height: 100vh;
 background: #13343b;
 z-index: 300;
 padding: 80px 40px 40px;
 transition: right 0.4s ease;
}

#home02 .drawer02--open {
 right: 0;
}

#home02 .drawer02__list li {
 border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

#home02 .drawer02__list a {
 display: block;
 padding: 16px 0;
 color: #fff;
 font-family: "Cormorant", serif;
 letter-spacing: 0.22em;
 font-size: 15px;
 text-transform: uppercase;
}

#home02 .drawer02__close {
 position: absolute;
 top: 24px;
 right: 24px;
 background: none;
 border: none;
 color: rgba(255, 255, 255, 0.6);
 font-family: "Cormorant", serif;
 letter-spacing: 0.2em;
 font-size: 13px;
 cursor: pointer;
}

/* ===== Section common label ===== */
#home02 .sec-en02 {
 font-family: "Cormorant", serif;
 letter-spacing: 0.34em;
 font-size: 13px;
 color: #c69a5b;
 margin-bottom: 16px;
 text-transform: uppercase;
 text-align: center;
}

/* ===== Reveal animation ===== */
#home02 .rv02 {
 opacity: 0;
 transform: translateY(28px);
 transition:
  opacity 1s ease,
  transform 1s ease;
}

#home02 .rv02.in02 {
 opacity: 1;
 transform: none;
}
@media screen and (min-width: 768px) {
 #home02 .rv02.in02 {
  opacity: 1;
  transform: none;
 }
}
@media (prefers-reduced-motion: reduce) {
 #home02 .rv02 {
  opacity: 1;
  transform: none;
  transition: none;
 }
}
#home02 .rv02.in02-1 {
 opacity: 1;
 transform: none;
}
@media screen and (min-width: 768px) {
 #home02 .rv02.in02-1 {
  opacity: 1;
  transform: none;
  text-align: center;
 }
}
/* ===== Fixed links (sugomori) ===== */
.sugomori-fixed-links {
 position: fixed;
 bottom: 20px;
 right: 20px;
 z-index: 500;
 display: flex;
 flex-direction: column;
 gap: 8px;
}

.sugomori-fixed-links .btn-reserve,
.sugomori-fixed-links .btn-contact {
 display: block;
 padding: 10px 16px;
 border-radius: 4px;
 font-size: 13px;
 font-weight: 600;
 text-align: center;
 line-height: 1.4;
}

.sugomori-fixed-links .btn-reserve {
 background: #c69a5b;
 color: #1c2024;
}

.sugomori-fixed-links .btn-contact {
 background: #13343b;
 color: #fff;
}

/* ===== Responsive ===== */
@media screen and (max-width: 860px) {
 #home02 .hd02__nav {
  display: none;
 }

 #home02 .hd02__burger {
  display: flex;
 }
}