

  :root { --section-y: 6.5rem; --wrap-pad: 3.5rem; }

  .hero .slideshow { aspect-ratio: 21 / 10; }

  .split { grid-template-columns: 1fr 1fr; gap: 4.5rem; }
  .split--rev > figure { order: 2; }

  .info-list dl { grid-template-columns: 8em 1fr; gap: 1rem; }

  .gallery-grid { gap: 2rem; }

  .drawer-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; padding: 3rem; }

 .drawer-menu { padding: 0; }

.site-header--static .head-nav { display: flex; }

:root { --header-h: 83px; --wrap-pad: 24px; --section-y: 96px; }

.site-header--overlay { min-height: 83px; padding-inline: 24px; }
.site-header .logo img { width: 181px; height: auto; }

.hero { height: calc(100vh - 83px); margin-top: 83px; }
.hero .slideshow, .hero .slide { height: 100%; }
.hero-body { padding: 0 24px 40px; }
.hero-ttl { font-size: 14px; line-height: 1.4; }

.tm-about { position: relative; padding: 160px 0 216px; }
.tm-about .sec-ttl-sub { font-size: 64px; }
.tm-about .sec-ttl-main { margin-top: 24px; font-size: 30px; line-height: 1.8; }
.tm-about .lead { max-width: 40em; margin: 48px auto 0; text-align: center; }
.tm-about .tm-framed { width: 384px; margin: 56px auto; }

.tm-rule { height: 400px; }
.tm-bandrow { height: 120px; }
.tm-colwrap { height: 810px; }
.tm-col { width: 256px; }
.tm-colttl { top: 378px; font-size: 30px; line-height: 1.8; }
.tm-fond { padding: 80px 0 120px; }
.tm-fond .lead { max-width: 42em; margin: 0 auto 1.5em; text-align: center; }
.tm-duo { gap: 80px; margin-top: 64px; margin-inline: -24px; }
.tm-duo img { aspect-ratio: 460 / 400; object-fit: cover; }

.tm-chef { padding: 120px 0 160px; }
.tm-chef .sec-ttl-sub { font-size: 80px; }
.tm-chef .split { --split-cols: minmax(0, 420px) minmax(0, 300px); gap: 80px; align-items: start; margin-top: 44px; }
.tm-chef .tm-gold { position: absolute; left: 0; top: 165px; z-index: 0; width: 1139px; height: 668px; }
.tm-chef .wrap { position: relative; z-index: 1; }
.tm-chef { position: relative; }
.tm-chef h3 { margin: 0 0 24px; font-size: 30px; font-weight: 600; }

.tm-chef .tm-framed { width: 300px; }
.tm-chef .tm-framed img { aspect-ratio: 3 / 4; object-fit: cover; }

.tm-shop { padding: 120px 0 96px; }
.tm-bleed { margin: 0 0 96px; }
.tm-bleed .tm-framed { width: 543px; }
.tm-bleed .tm-framed:first-child { margin-top: 100px; }
.tm-bleed .tm-framed::after { inset: -20px -20px 20px 20px; rotate: 0deg; }
.tm-shop .sec-ttl-sub { font-size: 40px; color: var(--color-fg-strong); }
.tm-wordmark { width: 400px; margin-top: 16px; }
.info-list { margin-top: 56px; }
.tm-shop .wrap { padding-inline: 0; }
.info-list--2col { column-count: 2; column-gap: 40px; }
.info-list--2col > * { break-inside: avoid; }
.info-list--2col > *:nth-child(5) { break-before: column; }
.info-list dl { gap: 12px; margin-bottom: 16px; padding-bottom: 12px; }
.info-list dt { width: 108px; }
.info-list dd { width: 360px; }
.tm-shop .btn { width: 216px; min-height: 43px; }
.tm-btnwrap { margin-top: 40px; }
.tm-btnwrap::before { left: calc(50% - 137px); width: 50px; }
.tm-btnwrap::after { width: 226px; height: 53px; margin: -26.5px 0 0 -113px; }
.tm-resvrail::before { top: -18px; }
.map-frame { margin-top: 80px; }
.map-frame iframe { height: 480px; }

.tm-pagettl { margin-top: 83px; padding: 72px 24px 56px; }
.tm-pagettl h1 { font-size: 40px; }
.tm-pagettl p { font-size: 14px; }
.tm-hero img { height: 700px; }
.tm-hero::after { background: linear-gradient(90deg, rgba(0, 0, 0, .68) 0%, rgba(0, 0, 0, .12) 36%, rgba(0, 0, 0, .12) 64%, rgba(0, 0, 0, .68) 100%); }
.tm-herocopy { gap: 24px; padding: 0 40px; font-size: 23px; line-height: 1.4; }
.tm-intro { padding: 80px 0 96px; text-align: center; }
.tm-intro .lead { max-width: 30em; margin: 0 auto; }
.tm-guidesec { padding: 0 0 104px; }
.tm-guidesec .sec-ttl { margin-bottom: 40px; }
.tm-guidesec .sec-ttl-sub { font-family: var(--font-jp); font-size: 32px; font-weight: 400; color: var(--tm-gold-display); }
.tm-guidesec .sec-ttl-main { margin-top: 14px; font-size: 14px; font-weight: 400; letter-spacing: .22em; }
.tm-guide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tm-season { padding: 96px 0 104px; }
.tm-sttl { margin-top: 44px; }
.tm-slead { max-width: 34em; margin: 36px auto 0; }
.tm-slead + .note-sm { margin-top: 32px; }
.tm-courses { display: flex; flex-direction: column; gap: 40px; margin-top: 56px; }
.tm-detail { padding: 24px 40px; }
.tm-detail ul { columns: 2; column-gap: 40px; }
.tm-sfoot { margin-top: 48px; text-align: center; }
.tm-sfoot .note-sm { margin: 0 0 22px; }
.tm-resv { padding: 88px 0 96px; text-align: center; }
.tm-resv .sec-ttl-sub { font-family: var(--font-jp); font-size: 32px; font-weight: 400; color: var(--tm-gold-display); }
.tm-resv .sec-ttl-main { margin-top: 16px; font-size: 20px; }
.tm-resv .lead { max-width: 28em; margin: 20px auto 0; }

.site-header .hamburger { display: none; }
.site-header .header-fix .btn { min-height: 47px; padding-block: 8px; }

.tm-resvrail .btn { width: 43px; height: 248px; }
.tm-about .tm-framed img { aspect-ratio: 384 / 310; object-fit: cover; }

.tm-rail { display: block; left: min(24px, calc((100vw - 1000px) / 2 - 200px)); }
.tm-pick { display: none; }

.tm-about .tm-rule { position: absolute; left: 50%; bottom: -280px; margin: 0; transform: translateX(-50%); }

.tm-about .lead.tm-fixed, .tm-fond .lead.tm-fixed { max-width: none; }

.tm-salon { margin-top: 83px; padding: 80px 0 120px; }
.tm-salon .wrap { max-width: none; padding-inline: 0; }

.tm-salon-head { position: relative; width: 880px; height: 618px; margin-inline: auto; }
.tm-salon-en { position: absolute; top: 0; left: 0; font-size: 64px; }
.tm-salon-intro { position: absolute; top: 0; left: 465px; width: 415px; }
.tm-salon-name { font-size: 16px; line-height: 28.8px; }
.tm-salon-madame { margin-top: 8px; font-size: 24px; line-height: 43.2px; }
.tm-salon-lead { margin-top: 42px; font-size: 16px; line-height: 28.8px; }
.tm-salon-photo1 { position: absolute; top: 118px; left: 0; width: 360px; }
.tm-salon-photo1 img { aspect-ratio: 360 / 500; object-fit: cover; }
.tm-salon-photo1::after { inset: 0; }

.tm-salon-row { display: flex; align-items: flex-start; width: 1093px; margin: 120px 0 0 110px; gap: 79px; }
.tm-salon-text { margin: 0; font-size: 16px; line-height: 28.8px; }
.tm-salon-photo2 { flex: none; width: 476px; margin-top: -80px; }
.tm-salon-photo2 img { aspect-ratio: 476 / 460; object-fit: cover; }

.tm-salon-row--rev { width: auto; margin-left: 0; margin-right: 0; gap: 80px; }
.tm-salon-photo3 { flex: none; width: 433px; }
.tm-salon-photo3 img { aspect-ratio: 433 / 450; object-fit: cover; }
.tm-salon-row--rev .tm-salon-text { width: 562px; flex: none; }
.tm-shift::after { inset: -20px -20px 20px 20px; }

.tm-salon-info { width: 1000px; margin: 120px auto 0; }
.tm-salon-h2 { font-size: 30px; line-height: 54px; }
.tm-salon-list { width: 1000px; max-width: none; margin-top: 40px; }
.tm-salon-list > div { display: flex; gap: 12px; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--color-fg-strong); }
.tm-salon-list dt { flex: none; width: 108px; }
.tm-salon-list dd { flex: 1 1 auto; margin: 0; }

#site-footer { padding: 40px 48px; }
#site-footer .footer-nav { display: flex; flex-direction: row; flex-wrap: wrap; gap: 28px; }
#site-footer .footer-copy { margin: 24px 0 0; text-align: right; }

.tm-nw { white-space: nowrap; }
.tm-seg { display: inline; }
