:root {
  --ink: #25231f;
  --sub: #6f7066;
  --paper: #f5f0e6;
  --paper2: #fbf8ef;
  --deep: #2f2a25;
  --green: #8f9d86;
  --green2: #dfe7d7;
  --line: #d9d0bf;
  --gold: #b79b61;
}

* {
  box-sizing: border-box
}

/*html,
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  letter-spacing: .055em;
  line-height: 2.05;
}*/

/*a {
  color: inherit;
  text-decoration: none
}*/

.sp {
  display: none
}

.pc {
  display: block
}

.site-header {
  position: absolute;
  z-index: 50;
  top: 0;
  left: 0;
  right: 0;
  height: 190px;
  padding: 24px 130px 0 160px;
  display: grid;
  grid-template-columns: 280px 1fr 190px;
  gap: 34px;
  color: #fff;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .45)
}

.logo-mark {
  display: block;
  width: 230px;
  height: 196px;
  margin-top: 10px;
  background: url("../summer/assets/images/embedded_001.png") center/contain no-repeat;
  font-size: 0;
  line-height: 0;
  color: transparent;
  text-shadow: none
}

.logo-mark small {
  display: none
}

.header-nav {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  padding-top: 14px;
  white-space: nowrap;
  font-size: 17px;
  line-height: 1
}

.header-nav a {
  height: 28px;
  padding: 0 12px;
  border-right: 1px solid rgba(255, 255, 255, .75);
  display: flex;
  align-items: center
}

.header-nav a:first-child {
  border-left: 1px solid rgba(255, 255, 255, .75)
}

.header-tools {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 88px 78px;
  gap: 12px;
  text-align: center
}

.tool {
  border: 1px solid rgba(255, 255, 255, .78);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 13px;
  background: rgba(20, 18, 16, .12)
}

.store {
  background: rgba(143, 157, 134, .88);
  font-size: 11px;
  line-height: 1.25
}

.store b {
  font-size: 21px;
  font-weight: 400
}

.menu i {
  width: 32px;
  height: 20px;
  border-top: 3px solid #fff;
  border-bottom: 3px solid #fff;
  position: relative;
  margin-bottom: 8px
}

.menu i:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 6px;
  border-top: 3px solid #fff
}

.lang {
  grid-column: 1/3;
  font-size: 15px
}

.lang b {
  font-size: 24px;
  font-weight: 400;
  line-height: 1
}

.hero {
  position: relative;
  min-height: 760px;
  background: linear-gradient(120deg, rgba(0, 0, 0, .52), rgba(0, 0, 0, .22) 50%, rgba(0, 0, 0, .50)), url("../summer/assets/images/embedded_002.jpg") center/cover no-repeat;
  color: #fff;
  display: flex;
  align-items: flex-end;
  padding: 0 8vw 120px;
  overflow: hidden
}

.hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 19vw);
  mix-blend-mode: screen;
  opacity: .45
}

.hero:after {
  content: none;
  display: none
}

.hero-inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(360px, 760px);
  gap: 0;
  width: 100%;
  align-items: end
}

.hero-title .en {
  font-family: Georgia, serif;
  font-size: 82px;
  line-height: .92;
  letter-spacing: .12em;
  color: #cbd4bd;
  margin-bottom: 30px
}

.hero-title h1 {
  font-size: 52px;
  font-weight: 400;
  letter-spacing: .28em;
  margin: 0 0 28px
}

.hero-title p {
  font-size: 22px;
  line-height: 2.05;
  margin: 0;
  max-width: 700px
}

.seasonal-note {
  max-width: 1180px;
  margin: 0 auto 100px;
  padding: 0 7vw
}

.seasonal-note-inner {
  position: relative;
  background: #fffaf0;
  border: 1px solid var(--line);
  padding: 56px 64px;
  display: grid;
  grid-template-columns: .9fr 1.2fr;
  gap: 54px;
  align-items: start
}

.seasonal-note .label {
  font-family: Georgia, serif;
  letter-spacing: .28em;
  font-size: 13px;
  color: var(--gold);
  margin-bottom: 18px
}

.seasonal-note h2 {
  font-size: 28px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: .16em;
  margin: 0
}

.seasonal-note p {
  font-size: 16px;
  line-height: 2.25;
  margin: 0;
  color: #4b4a43
}

.seasonal-note-list {
  grid-column: 1/3;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
  margin-top: 10px
}

.seasonal-note-list div {
  padding: 26px 28px 0;
  border-right: 1px solid var(--line);
  font-size: 15px;
  line-height: 2;
  color: #55534b
}

.seasonal-note-list div:last-child {
  border-right: 0
}

.seasonal-note-list span {
  display: block;
  font-family: Georgia, serif;
  color: var(--gold);
  font-size: 12px;
  letter-spacing: .22em;
  margin-bottom: 8px
}

.reserve-strip {
  background: #312c27;
  color: #fff;
  height: 62px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 5
}

.reserve-inner {
  width: 100%;
  max-width: 1520px;
  display: grid;
  grid-template-columns: 340px 220px 130px 90px 120px 150px 150px 130px 130px;
  height: 62px
}

.reserve-inner>* {
  border-left: 1px solid rgba(255, 255, 255, .25);
  display: flex;
  align-items: center;
  justify-content: center
}

.reserve-catch {
  background: #e5ddc6;
  color: #3b382f;
  font-size: 19px
}

.search {
  border: 1px solid #9ca68f;
  margin: 9px 12px;
  height: 44px;
  font-size: 18px
}

.reserve-choice {
  background: #cdbb91;
  color: #302b25;
  font-size: 14px
}

.reserve-choice:last-child {
  background: #a9b29c
}

.intro {
  position: relative;
  padding: 120px 8vw 90px;
  background: var(--paper2)
}

.intro-grid {
  display: grid;
  grid-template-columns: minmax(340px, 42vw) minmax(300px, 420px);
  justify-content: space-between;
  gap: clamp(42px, 6vw, 96px);
  align-items: start
}

.intro .kicker {
  font-family: Georgia, serif;
  color: #7f8f75;
  letter-spacing: .42em;
  font-size: 17px
}

.intro h2 {
  font-size: 40px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: .18em;
  margin: 25px 0 0
}

.intro p {
  font-size: 20px;
  line-height: 2.35;
  margin: 10px 0 0;
  max-width: 420px;
  justify-self: end;
  align-self: start
}

.intro:after {
  content: "SUMMER STAY";
  position: absolute;
  right: -.1em;
  top: 24px;
  font-family: Georgia, serif;
  font-size: 12vw;
  letter-spacing: .08em;
  color: rgba(143, 157, 134, .12);
  line-height: 1;
  white-space: nowrap
}

.big-layout {
  padding: 90px 0 40px
}

.dynamic-section {
  position: relative;
  min-height: 760px;
  margin: 0 0 130px;
  display: grid;
  grid-template-columns: 7vw 1fr 1fr 7vw;
  grid-template-rows: 90px auto 90px
}

.dynamic-section.reverse .visual {
  grid-column: 1/3
}

.dynamic-section.reverse .text {
  grid-column: 3/5;
  padding: 105px 8vw 95px 7vw
}

.dynamic-section.reverse .ghost {
  left: auto;
  right: 4vw
}

.visual {
  grid-column: 3/5;
  grid-row: 1/4;
  min-height: 680px;
  position: relative;
  overflow: hidden;
  background: #d9d4c4
}

.visual:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, .34)), repeating-linear-gradient(90deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 72px)
}

.visual.water {
  background: linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .08)), url("../summer/assets/images/embedded_003.jpg") center/cover no-repeat
}

.visual.bath {
  background-position: center;
  background: linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .14)), url("../summer/assets/images/embedded_004.jpg") center/cover no-repeat
}

.visual.shoji {
  background: linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .08)), url("../summer/assets/images/embedded_005.jpg") center/cover no-repeat
}

.visual.food {
  background: linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .16)), url("../summer/assets/images/embedded_006.jpg") center/cover no-repeat
}

.visual.water {
  background-position: center center
}

.visual.bath {
  background-position: center center
}

.visual.shoji {
  background-position: center center
}

.visual.food {
  background-position: center center
}

.hero {
  background-position: center center
}

.visual .vlabel {
  position: absolute;
  left: 48px;
  bottom: 42px;
  z-index: 2;
  color: #fff;
  font-family: Georgia, serif;
  font-size: 42px;
  letter-spacing: .12em;
  line-height: 1.08;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .35)
}

.text {
  grid-column: 1/3;
  grid-row: 2/3;
  background: var(--paper2);
  padding: 105px 7vw 95px 8vw;
  position: relative;
  z-index: 3;
  box-shadow: 0 18px 48px rgba(55, 45, 32, .08)
}

.num {
  display: block;
  font-family: Georgia, serif;
  font-size: 84px;
  line-height: 1;
  color: #9aa78f;
  opacity: .75;
  margin-bottom: 28px
}

.text h3 {
  font-size: 32px;
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: .16em;
  margin: 0 0 26px
}

.text p {
  font-size: 18px;
  line-height: 2.25;
  margin: 0;
  color: #3d3b35
}

.ghost {
  position: absolute;
  z-index: 1;
  left: 4vw;
  top: -34px;
  font-family: Georgia, serif;
  font-size: 13vw;
  line-height: 1;
  color: rgba(143, 157, 134, .12);
  letter-spacing: .03em;
  white-space: nowrap
}

.mini-note {
  margin-top: 34px;
  border-top: 1px solid var(--line);
  padding-top: 22px;
  color: #77736a;
  font-size: 15px;
  line-height: 2
}

.bathing-method {
  padding: 70px 8vw 120px;
  background: var(--paper);
  position: relative
}

.bathing-method:before {
  content: "BATHING";
  position: absolute;
  right: -.08em;
  top: 20px;
  font-family: Georgia, serif;
  font-size: 13vw;
  letter-spacing: .08em;
  line-height: 1;
  color: rgba(143, 157, 134, .10);
  white-space: nowrap
}

.method-panel {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 1px;
  background: var(--line);
  box-shadow: 0 18px 48px rgba(55, 45, 32, .07)
}

.method-head,
.method-body {
  background: var(--paper2);
  padding: 72px 6vw
}

.method-head .kicker {
  font-family: Georgia, serif;
  color: #7f8f75;
  letter-spacing: .32em;
  font-size: 14px;
  margin-bottom: 24px
}

.method-head h2 {
  font-size: 34px;
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: .16em;
  margin: 0
}

.method-body p {
  font-size: 17px;
  line-height: 2.35;
  margin: 0 0 30px;
  color: #3d3b35
}

.method-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  margin-top: 30px
}

.method-step {
  background: var(--paper2);
  padding: 30px 28px;
  min-height: 210px
}

.method-step span {
  display: block;
  font-family: Georgia, serif;
  color: #8f9d86;
  letter-spacing: .2em;
  font-size: 13px;
  margin-bottom: 12px
}

.method-step h3 {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.6;
  margin: 0 0 10px
}

.method-step p {
  font-size: 14px;
  line-height: 2;
  margin: 0;
  color: #68645c
}

.method-note {
  font-size: 13px;
  line-height: 2;
  color: #807a70;
  border-top: 1px solid var(--line);
  padding-top: 20px;
  margin-top: 24px
}

.method-visuals {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 28px;
  margin-top: 54px
}

.method-photo-main {
  min-height: 500px;
  background: url("../summer/assets/images/embedded_007.jpg") center/cover no-repeat;
  position: relative;
  overflow: hidden
}

.method-photo-main:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .38))
}

.method-photo-main span {
  position: absolute;
  left: 34px;
  bottom: 30px;
  z-index: 2;
  color: #fff;
  font-family: Georgia, serif;
  font-size: 34px;
  letter-spacing: .16em;
  line-height: 1.15
}

.method-photo-stack {
  display: grid;
  gap: 28px
}


.method-photo {
  min-height: 236px;
  background: #d8d0c2 center/cover no-repeat;
  position: relative;
  overflow: hidden
}

.method-photo:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(0, 0, 0, .34))
}

.method-photo span {
  position: absolute;
  left: 25px;
  bottom: 20px;
  z-index: 2;
  color: #fff;
  font-family: Georgia, serif;
  font-size: 22px;
  letter-spacing: .14em
}

.method-photo.water-img {
  background-image: url("../summer/assets/images/embedded_008.jpg")
}

.method-photo.shoji-img {
  background-image: url("../summer/assets/images/embedded_009.jpg")
}

.bridge-photo {
  position: relative;
  z-index: 2;
  min-height: 520px;
  background: url("../summer/assets/images/embedded_010.jpg") center/cover no-repeat
}

.bridge-photo:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(47, 42, 37, .08), rgba(47, 42, 37, .48))
}

.bridge-list {
  background: rgba(47, 42, 37, .92)
}

.time-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 36px;
  align-items: center
}

.time-body {
  min-width: 0
}

.time-photo {
  height: 170px;
  background: #d7d0c2 center/cover no-repeat;
  position: relative;
  overflow: hidden;
  box-shadow: 0 14px 36px rgba(55, 45, 32, .08)
}

.time-photo:after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, .38)
}

.time-photo.room {
  background-image: url("../summer/assets/images/embedded_011.jpg")
}

.time-photo.water {
  background-image: url("../summer/assets/images/embedded_012.jpg")
}

.time-photo.bath {
  background-image: url("../summer/assets/images/embedded_013.jpg")
}

.time-photo.food {
  background-image: url("../summer/assets/images/embedded_014.jpg")
}

.time-photo.night {
  background-image: url("../summer/assets/images/embedded_015.jpg")
}

.time-photo.morning {
  background-image: url("../summer/assets/images/embedded_016.jpg")
}


.bridge {
  margin: 80px 7vw 120px;
  background: #2f2a25;
  color: #fff;
  display: grid;
  grid-template-columns: 1fr .9fr .72fr;
  min-height: 520px;
  position: relative;
  overflow: hidden
}

.bridge:before {
  content: "OLD SUMMER";
  position: absolute;
  left: -.05em;
  bottom: -.23em;
  font-family: Georgia, serif;
  font-size: 13vw;
  color: rgba(255, 255, 255, .055);
  line-height: 1;
  letter-spacing: .08em
}

.bridge-text {
  padding: 92px 7vw;
  position: relative;
  z-index: 2
}

.bridge-text h2 {
  font-size: 34px;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: .16em;
  margin: 0 0 25px
}

.bridge-text p {
  font-size: 18px;
  line-height: 2.3;
  color: rgba(255, 255, 255, .86);
  margin: 0
}

.bridge-list {
  position: relative;
  z-index: 2;
  border-left: 1px solid rgba(255, 255, 255, .16);
  display: grid;
  align-content: center
}

.bridge-list div {
  padding: 28px 56px;
  border-bottom: 1px solid rgba(255, 255, 255, .16);
  font-size: 22px
}

.bridge-list span {
  display: block;
  font-family: Georgia, serif;
  font-size: 13px;
  color: #c4cfb6;
  letter-spacing: .24em;
  margin-bottom: 6px
}

.timeline {
  padding: 95px 8vw 150px;
  background: var(--paper2);
  position: relative
}

.timeline:before {
  content: "A DAY";
  position: absolute;
  right: -.05em;
  top: 34px;
  font-family: Georgia, serif;
  font-size: 13vw;
  letter-spacing: .08em;
  color: rgba(143, 157, 134, .10);
  line-height: 1;
  white-space: nowrap
}

.timeline h2 {
  position: relative;
  z-index: 2;
  font-size: 38px;
  font-weight: 400;
  letter-spacing: .18em;
  line-height: 1.6;
  margin: 0 0 58px
}

.time-grid {
  position: relative;
  z-index: 2;
  max-width: 980px;
  margin: 0 auto;
  display: block;
  background: transparent
}

.time-grid:before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 116px;
  width: 1px;
  background: var(--line)
}

.time-card {
  position: relative;
  background: transparent;
  min-height: 0;
  padding: 0 0 52px 190px
}

.time-card:before {
  content: "";
  position: absolute;
  left: 106px;
  top: 8px;
  width: 21px;
  height: 21px;
  border: 1px solid #8f9d86;
  background: var(--paper2);
  border-radius: 50%;
  box-shadow: 0 0 0 9px var(--paper2)
}

.time {
  position: absolute;
  left: 0;
  top: -3px;
  width: 82px;
  text-align: right;
  font-family: Georgia, serif;
  font-size: 18px;
  color: #8f9d86;
  letter-spacing: .12em
}

.time-card h3 {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.65;
  margin: 0 0 10px
}

.time-card p {
  font-size: 15px;
  line-height: 2.1;
  margin: 0;
  color: #68645c
}

.time-card:nth-child(even) {
  transform: none
}

.prefooter {
  position: relative;
  min-height: 520px;
  background: linear-gradient(100deg, rgba(0, 0, 0, .72), rgba(0, 0, 0, .24)), url("../summer/assets/images/embedded_017.jpg") center/cover no-repeat;
  color: #fff;
  display: flex;
  align-items: center;
  margin-top: 60px;
  overflow: hidden
}

.prefooter:after {
  content: "RESERVATION";
  position: absolute;
  right: -.1em;
  top: -.08em;
  font-family: Georgia, serif;
  font-size: 11vw;
  color: rgba(255, 255, 255, .08);
  letter-spacing: .08em
}

.prefooter-box {
  position: relative;
  z-index: 2;
  width: 560px;
  margin-left: 18vw;
  text-align: center;
  text-shadow: 0 3px 14px rgba(0, 0, 0, .5)
}

.prefooter-box p {
  font-size: 21px;
  margin: 0 0 18px
}

.prefooter-box .best {
  font-size: 22px;
  margin-bottom: 34px
}

.cta-btn {
  display: flex;
  width: 420px;
  height: 72px;
  margin: 0 auto 20px;
  border: 1px solid rgba(255, 255, 255, .78);
  align-items: center;
  justify-content: center;
  font-size: 22px
}

.cta-link {
  display: block;
  font-size: 18px;
  margin: 16px 0
}

.tel {
  font-size: 31px;
  line-height: 1.1;
  margin: 10px 0 26px
}

.line-btn {
  display: flex;
  width: 320px;
  height: 64px;
  margin: 0 auto;
  border: 1px solid rgba(255, 255, 255, .74);
  align-items: center;
  justify-content: center;
  font-size: 22px
}

.site-footer {
  background: #fbfaf6;
  padding: 112px 9% 86px;
  display: grid;
  grid-template-columns: 300px 1fr 560px;
  gap: 70px;
  min-height: 650px
}

.footer-logo {
  width: 260px;
  height: 222px;
  background: url("../summer/assets/images/embedded_018.png") center/contain no-repeat;
  font-size: 0;
  line-height: 0;
  color: transparent
}

.footer-logo small {
  display: none
}

.footer-menu {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 20px;
  font-size: 20px;
  line-height: 1.85
}

.footer-list a {
  display: block;
  margin: 0 0 14px
}

.footer-info {
  font-size: 19px;
  line-height: 2.05
}

.footer-info .name {
  font-size: 21px;
  margin-bottom: 10px
}

.wifi {
  font-size: 20px;
  margin: 22px 0 48px
}

.certificate {
  height: 72px;
  border: 1px solid #cdbb9d;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  color: #5d564c
}

.confirm {
  height: 31px;
  background: #9aa78f;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px
}

.footer-bottom {
  grid-column: 2/4;
  display: flex;
  gap: 160px;
  align-self: end;
  color: #393832;
  font-size: 15px
}

.page-top {
  position: fixed;
  right: 36px;
  bottom: 42px;
  font-size: 12px;
  line-height: 1.1;
  text-align: center;
  color: #2d2d29;
  z-index: 40
}

@media(max-width:1100px) {
  .pc {
    display: none
  }

  .sp {
    display: block
  }

  .site-header {
    height: 82px;
    padding: 12px 20px;
    display: flex;
    align-items: center;
    background: rgba(36, 31, 27, .55)
  }

  .logo-mark {
    width: 116px;
    height: 68px;
    margin: 0;
    background-size: contain
  }

  .header-nav {
    display: none
  }

  .header-tools {
    display: flex;
    margin-left: auto;
    gap: 8px;
    height: 56px
  }

  .store {
    display: none
  }

  .tool {
    width: 58px;
    height: 56px;
    font-size: 11px
  }

  .lang {
    grid-column: auto
  }

  .menu i {
    width: 26px
  }

  .hero {
    min-height: 680px;
    padding: 120px 26px 74px;
    align-items: flex-end
  }

  .hero:after {
    font-size: 28vw;
    right: -.5em;
    bottom: .04em
  }

  .hero-inner {
    display: block
  }

  .hero-title .en {
    font-size: 46px;
    line-height: 1.05;
    margin-bottom: 22px
  }

  .hero-title h1 {
    font-size: 38px;
    letter-spacing: .18em
  }

  .hero-title p {
    font-size: 18px;
    line-height: 2.1
  }

  .seasonal-note {
    margin: 0 auto 70px;
    padding: 0 26px
  }

  .seasonal-note-inner {
    display: block;
    padding: 38px 28px
  }

  .seasonal-note h2 {
    font-size: 23px;
    line-height: 1.75
  }

  .seasonal-note p {
    font-size: 16px;
    line-height: 2.2;
    margin-top: 22px
  }

  .seasonal-note-list {
    display: block;
    border-top: 1px solid var(--line);
    margin-top: 30px
  }

  .seasonal-note-list div {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 22px 0
  }

  .seasonal-note-list div:last-child {
    border-bottom: 0
  }

  .reserve-strip {
    height: auto
  }

  .reserve-inner {
    grid-template-columns: 1fr 1fr;
    width: 100%;
    height: auto
  }

  .reserve-inner>* {
    height: 48px
  }

  .reserve-catch {
    grid-column: 1/3;
    font-size: 14px
  }

  .reserve-inner>*:nth-child(n+3):nth-child(-n+7) {
    display: none
  }

  .reserve-choice {
    font-size: 12px
  }

  .intro {
    padding: 82px 26px 50px
  }

  .intro:after {
    font-size: 24vw;
    top: 20px
  }

  .intro-grid {
    display: block
  }

  .intro .kicker {
    font-size: 13px
  }

  .intro h2 {
    font-size: 28px;
    letter-spacing: .1em;
    line-height: 1.75
  }

  .intro p {
    font-size: 17px;
    line-height: 2.25;
    margin-top: 36px
  }

  .big-layout {
    padding: 40px 0 20px
  }

  .dynamic-section,
  .dynamic-section.reverse {
    display: block;
    min-height: auto;
    margin: 0 0 86px
  }

  .visual,
  .dynamic-section.reverse .visual {
    min-height: 360px;
    width: 86vw;
    margin-left: 14vw;
    background-position: center
  }

  .dynamic-section.reverse .visual {
    margin-left: 0;
    margin-right: 14vw
  }

  .visual .vlabel {
    font-size: 28px;
    left: 26px;
    bottom: 24px
  }

  .text,
  .dynamic-section.reverse .text {
    width: 88vw;
    margin: -46px auto 0;
    padding: 54px 28px 46px
  }

  .num {
    font-size: 54px;
    margin-bottom: 18px
  }

  .text h3 {
    font-size: 23px;
    letter-spacing: .1em;
    line-height: 1.75
  }

  .text p {
    font-size: 16px;
    line-height: 2.15
  }

  .ghost {
    font-size: 25vw;
    top: -22px;
    left: 4vw
  }

  .bathing-method {
    padding: 48px 26px 86px
  }

  .bathing-method:before {
    font-size: 24vw;
    top: 18px
  }

  .method-panel {
    display: block
  }

  .method-head,
  .method-body {
    padding: 46px 28px
  }

  .method-head h2 {
    font-size: 26px;
    line-height: 1.8
  }

  .method-body p {
    font-size: 16px;
    line-height: 2.2
  }

  .method-steps {
    display: block;
    background: transparent
  }

  .method-step {
    border-top: 1px solid var(--line);
    min-height: auto;
    padding: 24px 0
  }

  .method-visuals {
    display: block;
    margin-top: 38px
  }

  .method-photo-main {
    min-height: 360px
  }

  .method-photo-main span {
    font-size: 26px;
    left: 24px;
    bottom: 24px
  }

  .method-photo-stack {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 12px
  }

  .method-photo {
    min-height: 170px
  }

  .method-photo span {
    font-size: 15px;
    left: 16px;
    bottom: 14px
  }

  .bridge-photo {
    min-height: 300px
  }

  .time-card {
    display: block
  }

  .time-photo {
    height: 185px;
    margin-top: 18px
  }

  .time-body {
    min-width: 0
  }

  .bridge {
    margin: 20px 0 86px;
    display: block
  }

  .bridge-text {
    padding: 70px 28px 36px
  }

  .bridge-text h2 {
    font-size: 27px;
    line-height: 1.8
  }

  .bridge-text p {
    font-size: 16px
  }

  .bridge-list {
    border-left: 0
  }

  .bridge-list div {
    padding: 24px 28px;
    font-size: 18px
  }

  .timeline {
    padding: 70px 26px 100px
  }

  .timeline h2 {
    font-size: 28px;
    line-height: 1.7
  }

  .time-grid {
    max-width: none
  }

  .time-grid:before {
    left: 70px
  }

  .time-card {
    border-top: 0;
    min-height: auto;
    padding: 0 0 36px 112px
  }

  .time-card:before {
    left: 60px
  }

  .time {
    left: 0;
    width: 48px;
    font-size: 15px
  }

  .prefooter {
    min-height: 450px
  }

  .prefooter-box {
    width: auto;
    margin: 0;
    padding: 54px 26px
  }

  .prefooter-box p,
  .prefooter-box .best {
    font-size: 18px
  }

  .cta-btn {
    width: 100%;
    height: 64px
  }

  .line-btn {
    width: 78%;
    height: 58px
  }

  .tel {
    font-size: 26px
  }

  .site-footer {
    grid-template-columns: 1fr;
    padding: 75px 28px 82px;
    gap: 32px;
    min-height: auto
  }

  .footer-logo {
    width: 220px;
    height: 188px
  }

  .footer-menu {
    font-size: 18px
  }

  .footer-info {
    font-size: 16px
  }

  .footer-bottom {
    grid-column: auto;
    display: block;
    font-size: 13px
  }

  .page-top {
    display: none
  }
}

@media (max-width: 980px) {
  .intro-grid {
    grid-template-columns: 1fr
  }

  .intro p {
    max-width: none;
    justify-self: start;
    margin-top: 28px
  }
}


.seasonal-note {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  position: relative !important;
}

.seasonal-note-inner {
  width: 100% !important;
  max-width: none !important;
  min-height: 920px !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 0 150px !important;
  background: #fff !important;
  display: block !important;
  border: 0 !important;
  overflow: hidden !important;
}

.seasonal-note-inner::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 64px;
  background: linear-gradient(180deg, #27342f, #5f6c62);
  opacity: .95;
  z-index: 0;
}

.seasonal-note-inner::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 64px;
  background:
    radial-gradient(circle at 22px 22px, rgba(255, 255, 255, .28) 0 2px, transparent 3px),
    radial-gradient(circle at 46px 120px, rgba(255, 255, 255, .22) 0 1px, transparent 3px),
    radial-gradient(circle at 18px 240px, rgba(255, 255, 255, .18) 0 1px, transparent 3px);
  z-index: 1;
  pointer-events: none;
}

.seasonal-main {
  position: absolute !important;
  left: 64px !important;
  top: 0 !important;
  width: 74vw !important;
  height: 620px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #e9e5dc !important;
  overflow: hidden !important;
  z-index: 2 !important;
  box-shadow: none !important;
}

.seasonal-main img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.seasonal-sub {
  position: absolute !important;
  right: 5vw !important;
  top: 245px !important;
  width: 34vw !important;
  height: 520px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #e9e5dc !important;
  overflow: hidden !important;
  z-index: 4 !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .08) !important;
}

.seasonal-sub img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.seasonal-copy {
  position: absolute !important;
  left: 18vw !important;
  top: 575px !important;
  width: 56vw !important;
  min-height: 310px !important;
  background: #fff !important;
  margin: 0 !important;
  padding: 58px 70px 64px !important;
  z-index: 3 !important;
  border: 0 !important;
  box-shadow: none !important;
}

.seasonal-copy .label {
  display: none !important;
}

.seasonal-copy h2 {
  margin: 0 0 24px !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 64px !important;
  line-height: 1.12 !important;
  font-weight: 500 !important;
  letter-spacing: .08em !important;
  color: #173f35 !important;
}

.seasonal-copy h2 .jp {
  display: block !important;
  margin-top: 34px !important;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
  font-size: 15px !important;
  line-height: 2.05 !important;
  letter-spacing: .12em !important;
  color: #5b5a53 !important;
  max-width: 420px !important;
  font-weight: 400 !important;
}

.seasonal-copy .lead {
  display: none !important;
}

.seasonal-note-list {
  display: none !important;
}

.seasonal-reserve {
  display: none !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 360px !important;
  height: 86px !important;
  background: #173f35 !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  letter-spacing: .36em !important;
  z-index: 5 !important;
}

.seasonal-reserve::after {
  content: "";
  width: 42px;
  height: 1px;
  background: rgba(255, 255, 255, .7);
  margin-left: 22px;
}

@media (max-width:980px) {
  .seasonal-note-inner {
    min-height: auto !important;
    padding: 0 0 80px !important;
    background: #fff !important;
  }

  .seasonal-note-inner::before,
  .seasonal-note-inner::after {
    width: 28px !important;
  }

  .seasonal-main {
    position: relative !important;
    left: 28px !important;
    top: auto !important;
    width: calc(100% - 28px) !important;
    height: 340px !important;
  }

  .seasonal-sub {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 70% !important;
    height: 260px !important;
    margin: -32px 20px 0 auto !important;
  }

  .seasonal-copy {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    min-height: auto !important;
    padding: 42px 30px 48px !important;
    margin: -26px 28px 0 0 !important;
  }

  .seasonal-copy h2 {
    font-size: 36px !important;
    line-height: 1.2 !important;
    letter-spacing: .06em !important;
  }

  .seasonal-copy h2 .jp {
    margin-top: 24px !important;
    font-size: 14px !important;
    line-height: 2 !important;
  }

  .seasonal-reserve {
    display: none !important;
    position: relative !important;
    width: 72% !important;
    height: 70px !important;
    margin: -20px 0 0 auto !important;
  }
}



.intro h2 {
  font-size: 46px !important;
  line-height: 1.6 !important;
  letter-spacing: .1em !important;
  color: #2f322d !important;
}

.intro p {
  font-size: 16px !important;
  line-height: 2.1 !important;
  color: #5a5952 !important;
}

.intro:after {
  font-size: 11vw !important;
  top: 8px !important;
  right: 0 !important;
  color: rgba(143, 157, 134, .08) !important;
}

.dynamic-section {
  min-height: 700px !important;
  margin: 0 0 110px !important;
  grid-template-rows: 70px auto 60px !important;
}

.dynamic-section.reverse .text {
  padding: 88px 6vw 76px 6vw !important;
}

.text {
  position: relative !important;
  z-index: 2 !important;
  padding: 88px 6vw 76px 6vw !important;
  align-self: end !important;
  background: rgba(247, 243, 236, .96) !important;
}

.num {
  display: block !important;
  font-family: Georgia, serif !important;
  font-size: 72px !important;
  line-height: 1 !important;
  color: #a3ad98 !important;
  opacity: .9 !important;
  margin-bottom: 22px !important;
}

.text h3 {
  font-size: 56px !important;
  font-weight: 400 !important;
  line-height: 1.32 !important;
  letter-spacing: .08em !important;
  margin: 0 0 26px !important;
  color: #173f35 !important;
}

.text p {
  font-size: 16px !important;
  line-height: 2.1 !important;
  margin: 0 !important;
  color: #5b5a53 !important;
  max-width: 32em !important;
}

.mini-note {
  margin-top: 28px !important;
  border-top: 1px solid var(--line) !important;
  padding-top: 18px !important;
  color: #736f67 !important;
  font-size: 14px !important;
  line-height: 2 !important;
  max-width: 32em !important;
}

.ghost {
  position: absolute !important;
  z-index: 1 !important;
  left: 4vw !important;
  top: 18px !important;
  font-family: Georgia, serif !important;
  font-size: 10vw !important;
  line-height: 1 !important;
  color: rgba(143, 157, 134, .07) !important;
  letter-spacing: .03em !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

.dynamic-section.reverse .ghost {
  left: auto !important;
  right: 4vw !important;
  top: 18px !important;
}

@media (max-width:980px) {
  .intro h2 {
    font-size: 34px !important;
    line-height: 1.65 !important;
    letter-spacing: .07em !important;
  }

  .intro p {
    font-size: 15px !important;
    line-height: 2 !important;
  }

  .intro:after {
    font-size: 26vw !important;
    top: 18px !important;
  }

  .dynamic-section {
    min-height: auto !important;
    margin: 0 0 70px !important;
    grid-template-rows: auto !important;
  }

  .text,
  .dynamic-section.reverse .text {
    padding: 42px 24px 40px !important;
    background: rgba(247, 243, 236, .98) !important;
  }

  .num {
    font-size: 54px !important;
    margin-bottom: 14px !important;
  }

  .text h3 {
    font-size: 32px !important;
    line-height: 1.45 !important;
    letter-spacing: .06em !important;
  }

  .text p {
    font-size: 15px !important;
    line-height: 2 !important;
  }

  .mini-note {
    font-size: 14px !important;
    line-height: 1.9 !important;
  }

  .ghost {
    top: 6px !important;
    font-size: 24vw !important;
    color: rgba(143, 157, 134, .06) !important;
  }
}



.intro {
  padding: 112px 8vw 88px !important;
}

.intro-grid {
  grid-template-columns: minmax(560px, 58vw) 1fr !important;
  gap: 5.5vw !important;
  align-items: start !important;
}

.intro .kicker {
  font-size: 16px !important;
  letter-spacing: .36em !important;
  color: #8a9880 !important;
}

.intro h2 {
  font-size: 34px !important;
  line-height: 1.85 !important;
  font-weight: 400 !important;
  letter-spacing: .08em !important;
  color: #2f322d !important;
  margin: 24px 0 0 !important;
  max-width: 22em !important;
  word-break: normal !important;
  line-break: strict !important;
}

.intro p {
  font-size: 16px !important;
  line-height: 2.15 !important;
  color: #5b5a53 !important;
  max-width: 32em !important;
  word-break: normal !important;
  line-break: strict !important;
}

.intro:after {
  font-size: 14vw !important;
  top: -6px !important;
  right: -.04em !important;
  color: rgba(143, 157, 134, .06) !important;
  letter-spacing: .06em !important;
}

.seasonal-copy {
  width: 54vw !important;
  padding: 52px 56px 56px !important;
  background: #fff !important;
}

.seasonal-copy h2 {
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
  font-size: 34px !important;
  line-height: 1.75 !important;
  font-weight: 400 !important;
  letter-spacing: .12em !important;
  color: #173f35 !important;
  margin: 0 0 22px !important;
  word-break: normal !important;
  line-break: strict !important;
}

.seasonal-copy h2 .jp {
  display: block !important;
  margin-top: 22px !important;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  letter-spacing: .06em !important;
  color: #5b5a53 !important;
  max-width: 33em !important;
  font-weight: 400 !important;
  word-break: normal !important;
  line-break: strict !important;
}

.text h3 {
  font-size: 34px !important;
  line-height: 1.75 !important;
  letter-spacing: .12em !important;
  color: #173f35 !important;
  word-break: normal !important;
  line-break: strict !important;
}

.text p,
.mini-note {
  font-size: 16px !important;
  line-height: 2.1 !important;
  color: #5b5a53 !important;
  word-break: normal !important;
  line-break: strict !important;
}

@media (max-width:980px) {
  .intro {
    padding: 74px 24px 58px !important;
  }

  .intro-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  .intro h2 {
    font-size: 29px !important;
    line-height: 1.75 !important;
    letter-spacing: .06em !important;
    max-width: none !important;
  }

  .intro p {
    font-size: 15px !important;
    line-height: 2 !important;
    max-width: none !important;
  }

  .intro:after {
    font-size: 24vw !important;
    top: 2px !important;
    right: 0 !important;
    color: rgba(143, 157, 134, .05) !important;
  }

  .seasonal-copy {
    width: auto !important;
    padding: 34px 28px 36px !important;
  }

  .seasonal-copy h2 {
    font-size: 28px !important;
    line-height: 1.7 !important;
    letter-spacing: .08em !important;
  }

  .seasonal-copy h2 .jp {
    font-size: 15px !important;
    line-height: 2 !important;
    letter-spacing: .04em !important;
    max-width: none !important;
  }

  .text h3 {
    font-size: 28px !important;
    line-height: 1.7 !important;
    letter-spacing: .08em !important;
  }

  .text p,
  .mini-note {
    font-size: 15px !important;
    line-height: 2 !important;
  }
}



.seasonal-note {
  background: var(--paper) !important;
}

.seasonal-note-inner {
  background: var(--paper) !important;
}

.seasonal-main {
  background: #e8e1d3 !important;
}

.seasonal-sub {
  background: #e8e1d3 !important;
}

.seasonal-copy {
  background: var(--paper2) !important;
  box-shadow: 0 10px 28px rgba(39, 34, 27, .06) !important;
}

@media (max-width:980px) {
  .seasonal-note {
    background: var(--paper) !important;
  }

  .seasonal-note-inner {
    background: var(--paper) !important;
  }

  .seasonal-copy {
    background: var(--paper2) !important;
  }
}



/* Dynamic sections: make text reliably visible and aligned */
.dynamic-section {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 56px minmax(420px, 560px) minmax(360px, 1fr) 56px !important;
  grid-template-rows: 88px auto 64px !important;
  gap: 0 !important;
  min-height: 760px !important;
  align-items: start !important;
  margin: 0 0 110px !important;
  background: var(--paper) !important;
}

.dynamic-section.reverse {
  grid-template-columns: 56px minmax(360px, 1fr) minmax(420px, 560px) 56px !important;
  display: grid !important;
  min-height: 760px !important;
  margin: 0 0 110px !important;
}

.dynamic-section .ghost {
  position: absolute !important;
  top: 18px !important;
  left: 24px !important;
  right: auto !important;
  font-size: 11vw !important;
  line-height: 1 !important;
  color: rgba(143, 157, 134, .07) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
}

.dynamic-section.reverse .ghost {
  left: auto !important;
  right: 24px !important;
}

.dynamic-section .visual {
  grid-column: 3/5 !important;
  grid-row: 1/4 !important;
  min-height: 700px !important;
  position: relative !important;
  z-index: 2 !important;
  background-position: center !important;
  background-size: cover !important;
}

.dynamic-section.reverse .visual {
  grid-column: 1/3 !important;
  grid-row: 1/4 !important;
}

.dynamic-section .text {
  grid-column: 2/4 !important;
  grid-row: 2/3 !important;
  align-self: start !important;
  justify-self: start !important;
  position: relative !important;
  z-index: 5 !important;
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  padding: 62px 56px 54px !important;
  background: var(--paper2) !important;
  box-shadow: 0 12px 30px rgba(39, 34, 27, .06) !important;
  color: #2f322d !important;
}

.dynamic-section.reverse .text {
  grid-column: 3/5 !important;
  grid-row: 2/3 !important;
  justify-self: stretch !important;
  width: auto !important;
  max-width: none !important;
  margin-left: -120px !important;
}

.dynamic-section .text * {
  visibility: visible !important;
  opacity: 1 !important;
}

.dynamic-section .num {
  display: block !important;
  font-family: Georgia, serif !important;
  font-size: 64px !important;
  line-height: 1 !important;
  color: #9aa78f !important;
  opacity: .9 !important;
  margin: 0 0 20px !important;
}

.dynamic-section .text h3 {
  display: block !important;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
  font-size: 34px !important;
  line-height: 1.75 !important;
  letter-spacing: .10em !important;
  font-weight: 400 !important;
  color: #173f35 !important;
  margin: 0 0 22px !important;
  word-break: normal !important;
  line-break: strict !important;
}

.dynamic-section .text p {
  display: block !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  color: #5b5a53 !important;
  margin: 0 !important;
  max-width: 32em !important;
  word-break: normal !important;
  line-break: strict !important;
}

.dynamic-section .mini-note {
  display: block !important;
  margin-top: 22px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--line) !important;
  font-size: 14px !important;
  line-height: 2 !important;
  color: #736f67 !important;
  max-width: 32em !important;
}

.dynamic-section .vlabel {
  font-size: 34px !important;
  line-height: 1.18 !important;
  left: 32px !important;
  bottom: 32px !important;
  z-index: 3 !important;
}

/* similar text blocks elsewhere */
.bridge-text h2,
.method-head h2,
.time-body h3 {
  font-size: 34px !important;
  line-height: 1.75 !important;
  letter-spacing: .10em !important;
  color: #173f35 !important;
  font-weight: 400 !important;
}

.bridge-text p,
.method-body p,
.time-body p,
.method-step p {
  font-size: 16px !important;
  line-height: 2.1 !important;
  color: #5b5a53 !important;
}

@media (max-width:980px) {

  .dynamic-section,
  .dynamic-section.reverse {
    display: block !important;
    min-height: auto !important;
    margin: 0 0 76px !important;
    background: var(--paper) !important;
  }

  .dynamic-section .ghost {
    font-size: 22vw !important;
    top: 10px !important;
    left: 14px !important;
    right: auto !important;
    color: rgba(143, 157, 134, .06) !important;
  }

  .dynamic-section.reverse .ghost {
    right: 14px !important;
    left: auto !important;
  }

  .dynamic-section .visual,
  .dynamic-section.reverse .visual {
    min-height: 300px !important;
    width: auto !important;
    margin: 0 !important;
  }

  .dynamic-section .text,
  .dynamic-section.reverse .text {
    width: auto !important;
    max-width: none !important;
    margin: -34px 22px 0 !important;
    padding: 36px 24px 34px !important;
    background: var(--paper2) !important;
  }

  .dynamic-section .num {
    font-size: 48px !important;
    margin-bottom: 12px !important;
  }

  .dynamic-section .text h3 {
    font-size: 28px !important;
    line-height: 1.7 !important;
    letter-spacing: .08em !important;
  }

  .dynamic-section .text p {
    font-size: 15px !important;
    line-height: 2 !important;
    max-width: none !important;
  }

  .dynamic-section .mini-note {
    font-size: 14px !important;
    line-height: 1.9 !important;
    max-width: none !important;
  }

  .dynamic-section .vlabel {
    font-size: 24px !important;
    left: 20px !important;
    bottom: 20px !important;
  }
}



.dynamic-section .ghost {
  z-index: 4 !important;
  color: rgba(143, 157, 134, .10) !important;
}

.dynamic-section .visual {
  z-index: 2 !important;
}

.dynamic-section .text {
  z-index: 5 !important;
}

@media (max-width:980px) {
  .dynamic-section .ghost {
    z-index: 4 !important;
    color: rgba(143, 157, 134, .08) !important;
  }
}



/* 背景英字が本文カードや写真に隠れて見切れないように調整 */
.dynamic-section .ghost {
  z-index: 1 !important;
  top: 72px !important;
  left: 7vw !important;
  right: auto !important;
  font-size: 8.2vw !important;
  line-height: 1 !important;
  color: rgba(143, 157, 134, .085) !important;
  letter-spacing: .04em !important;
  white-space: nowrap !important;
  pointer-events: none !important;
  overflow: visible !important;
}

.dynamic-section.reverse .ghost {
  left: 7vw !important;
  right: auto !important;
  top: 72px !important;
}

.dynamic-section {
  overflow: visible !important;
}

.dynamic-section .text {
  z-index: 4 !important;
}

.dynamic-section .visual {
  z-index: 2 !important;
}

/* 02以降も背景英字がカードの裏に沈みすぎないようにする */
.dynamic-section .text {
  margin-top: 74px !important;
}

.dynamic-section.reverse .text {
  margin-top: 74px !important;
}

/* スマホでは見切れやすいので、背景英字はさらに薄く小さく */
@media (max-width:980px) {

  .dynamic-section .ghost,
  .dynamic-section.reverse .ghost {
    top: 18px !important;
    left: 22px !important;
    right: auto !important;
    font-size: 18vw !important;
    color: rgba(143, 157, 134, .055) !important;
  }

  .dynamic-section .text,
  .dynamic-section.reverse .text {
    margin-top: -26px !important;
  }
}



/* 問題が出ている動的セクションの英字装飾を整理 */
.dynamic-section .ghost,
.dynamic-section .vlabel {
  display: none !important;
  content: none !important;
}

/* 英字を外した分、余白と見出し位置を少し整える */
.dynamic-section .text,
.dynamic-section.reverse .text {
  margin-top: 28px !important;
}

.dynamic-section .num {
  margin-bottom: 18px !important;
}

.dynamic-section .text h3 {
  margin-top: 0 !important;
}

@media (max-width:980px) {

  .dynamic-section .text,
  .dynamic-section.reverse .text {
    margin-top: -18px !important;
  }
}



/* 夏の涼み支度セクション：テキスト領域を削除し、画像のみ残す */
.seasonal-copy {
  display: none !important;
}

.seasonal-note-inner {
  min-height: 790px !important;
  padding: 0 0 36px !important;
}

.seasonal-main {
  height: 620px !important;
}

.seasonal-sub {
  top: 245px !important;
  height: 470px !important;
}

@media (max-width:980px) {
  .seasonal-copy {
    display: none !important;
  }

  .seasonal-note-inner {
    min-height: auto !important;
    padding: 0 0 24px !important;
  }

  .seasonal-main {
    position: relative !important;
    left: 28px !important;
    width: calc(100% - 28px) !important;
    height: 280px !important;
  }

  .seasonal-sub {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 72% !important;
    height: 220px !important;
    margin: -18px 20px 0 auto !important;
  }
}



/* 不感温浴セクションをダイナミックに再構成 */
.bathing-method.bath-story {
  position: relative;
  overflow: hidden;
  min-height: 1080px;
  padding: 0 0 90px;
  background: #dcd8cd;
}

.bath-story-bg {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(64, 73, 68, .22), rgba(64, 73, 68, .22)), url("../summer/assets/images/embedded_019.jpg");
  background-size: cover;
  background-position: center center;
  transform: scale(1.02);
}

.bath-story-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(226, 222, 211, .30) 0%, rgba(226, 222, 211, .18) 28%, rgba(226, 222, 211, .72) 56%, rgba(226, 222, 211, .96) 100%);
}

.bath-story:before {
  content: "BATHING";
  position: absolute;
  left: 4vw;
  bottom: 240px;
  font-family: Georgia, serif;
  font-size: 14vw;
  letter-spacing: .08em;
  line-height: .9;
  color: rgba(255, 255, 255, .16);
  z-index: 1;
  pointer-events: none;
}

.bath-story-intro {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 180px minmax(0, 760px);
  column-gap: 48px;
  align-items: start;
  padding: 84px 7vw 0;
}

.bath-story-label-vert {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  color: #fff;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding-top: 6px;
}

.bath-story-label-vert span {
  font-family: Georgia, serif;
  font-size: 16px;
  letter-spacing: .14em;
  opacity: .92;
}

.bath-story-label-vert strong {
  font-size: 54px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: .10em;
}

.bath-story-copy {
  max-width: 760px;
  color: #fff;
  padding-top: 4px;
}

.bath-story-copy .kicker {
  font-family: Georgia, serif;
  font-size: 14px;
  letter-spacing: .34em;
  margin-bottom: 22px;
  color: rgba(255, 255, 255, .88);
}

.bath-story-copy h2 {
  margin: 0 0 28px;
  font-size: 50px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: .12em;
  color: #fff;
  text-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

.bath-story-copy p {
  margin: 0 0 22px;
  max-width: 650px;
  font-size: 18px;
  line-height: 2.25;
  color: rgba(255, 255, 255, .96);
  text-shadow: 0 4px 16px rgba(0, 0, 0, .10);
}

.bath-story-aside {
  position: relative;
  z-index: 3;
  display: flex;
  justify-content: flex-end;
  gap: 26px;
  padding: 52px 7vw 0;
}

.bath-story-mini {
  box-shadow: 0 24px 48px rgba(36, 29, 19, .16);
  border: 1px solid rgba(255, 255, 255, .34);
  background-size: cover;
  background-position: center;
}

.bath-story-mini-water {
  width: 280px;
  height: 220px;
  margin-top: 42px;
  background-image: url("../summer/assets/images/embedded_020.jpg");
}

.bath-story-mini-shoji {
  width: 220px;
  height: 300px;
  background-image: url("../summer/assets/images/embedded_021.jpg");
}

.bath-story-steps {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 78px 7vw 0 auto;
  width: min(980px, calc(100% - 14vw));
  background: rgba(241, 238, 231, .95);
  border: 1px solid rgba(191, 185, 171, .9);
  box-shadow: 0 28px 60px rgba(51, 42, 30, .10);
}

.bath-story-step {
  padding: 38px 32px 34px;
  border-right: 1px solid rgba(199, 193, 180, .9);
}

.bath-story-step:last-child {
  border-right: none;
}

.bath-story-step span {
  display: block;
  margin-bottom: 16px;
  font-family: Georgia, serif;
  font-size: 14px;
  letter-spacing: .22em;
  color: #8f9d86;
}

.bath-story-step h3 {
  margin: 0 0 14px;
  font-size: 28px;
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: .08em;
  color: #1d493f;
}

.bath-story-step p {
  margin: 0;
  font-size: 16px;
  line-height: 2.1;
  color: #585349;
}

.bath-story-note {
  position: relative;
  z-index: 3;
  width: min(980px, calc(100% - 14vw));
  margin: 26px 7vw 0 auto;
  padding-top: 18px;
  border-top: 1px solid rgba(188, 181, 168, .92);
  font-size: 14px;
  line-height: 2.05;
  color: #6e675c;
}

@media (max-width:1200px) {
  .bath-story-intro {
    grid-template-columns: 130px minmax(0, 1fr);
  }

  .bath-story-copy h2 {
    font-size: 42px;
  }

  .bath-story-copy p {
    font-size: 17px;
  }

  .bath-story-step h3 {
    font-size: 24px;
  }
}

@media (max-width:980px) {
  .bathing-method.bath-story {
    min-height: auto;
    padding-bottom: 56px;
  }

  .bath-story:before {
    display: none;
  }

  .bath-story-bg {
    background-position: center top;
  }

  .bath-story-overlay {
    background: linear-gradient(180deg, rgba(66, 76, 70, .34) 0%, rgba(226, 222, 211, .40) 38%, rgba(226, 222, 211, .96) 62%, rgba(226, 222, 211, .98) 100%);
  }

  .bath-story-intro {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 54px 24px 0;
  }

  .bath-story-label-vert {
    writing-mode: horizontal-tb;
    gap: 10px;
    color: #fff;
  }

  .bath-story-label-vert strong {
    font-size: 28px;
    letter-spacing: .08em;
  }

  .bath-story-label-vert span {
    font-size: 12px;
  }

  .bath-story-copy {
    max-width: none;
  }

  .bath-story-copy .kicker {
    font-size: 12px;
  }

  .bath-story-copy h2 {
    font-size: 30px;
    line-height: 1.6;
    margin-bottom: 20px;
  }

  .bath-story-copy p {
    font-size: 15px;
    line-height: 2.05;
    max-width: none;
  }

  .bath-story-aside {
    padding: 28px 24px 0;
    gap: 14px;
    justify-content: space-between;
  }

  .bath-story-mini-water {
    width: 56%;
    height: 180px;
    margin-top: 32px;
  }

  .bath-story-mini-shoji {
    width: 38%;
    height: 220px;
  }

  .bath-story-steps {
    grid-template-columns: 1fr;
    width: auto;
    margin: 36px 24px 0;
    background: rgba(241, 238, 231, .97);
  }

  .bath-story-step {
    border-right: none;
    border-bottom: 1px solid rgba(199, 193, 180, .9);
    padding: 26px 22px;
  }

  .bath-story-step:last-child {
    border-bottom: none;
  }

  .bath-story-step h3 {
    font-size: 22px;
    line-height: 1.6;
  }

  .bath-story-step p {
    font-size: 15px;
    line-height: 2;
  }

  .bath-story-note {
    width: auto;
    margin: 20px 24px 0;
    font-size: 13px;
  }
}



/* 不感温浴セクション：写真を薄くしすぎず、文字は面で読ませる */
.bath-story-bg {
  filter: none !important;
  opacity: 1 !important;
  transform: scale(1.01) !important;
}

.bath-story-overlay {
  background:
    linear-gradient(90deg, rgba(25, 38, 33, .48) 0%, rgba(25, 38, 33, .28) 34%, rgba(25, 38, 33, .08) 62%, rgba(25, 38, 33, .02) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, .10) 0%, rgba(0, 0, 0, .02) 42%, rgba(245, 240, 230, .82) 76%, rgba(245, 240, 230, .96) 100%) !important;
}

.bath-story-intro {
  padding-top: 96px !important;
  grid-template-columns: 150px minmax(0, 720px) !important;
}

.bath-story-label-vert {
  background: rgba(22, 49, 42, .34) !important;
  backdrop-filter: blur(2px) !important;
  padding: 28px 22px !important;
  min-height: 330px !important;
  justify-content: flex-start !important;
}

.bath-story-copy {
  background: rgba(19, 45, 39, .42) !important;
  backdrop-filter: blur(4px) !important;
  padding: 46px 54px 42px !important;
  box-shadow: 0 24px 60px rgba(23, 28, 22, .18) !important;
}

.bath-story-copy h2 {
  font-size: 46px !important;
  line-height: 1.5 !important;
  margin-bottom: 24px !important;
}

.bath-story-copy p {
  font-size: 16px !important;
  line-height: 2.16 !important;
  max-width: 620px !important;
}

.bath-story-aside {
  padding-top: 36px !important;
}

.bath-story-mini {
  border: 0 !important;
  box-shadow: 0 22px 54px rgba(23, 28, 22, .20) !important;
}

.bath-story-mini-water {
  width: 320px !important;
  height: 210px !important;
  margin-top: 80px !important;
}

.bath-story-mini-shoji {
  width: 240px !important;
  height: 320px !important;
}

.bath-story-steps {
  margin-top: 64px !important;
  background: rgba(251, 248, 239, .94) !important;
  border: 0 !important;
  box-shadow: 0 28px 70px rgba(39, 34, 27, .13) !important;
}

.bath-story-step {
  background: transparent !important;
}

.bath-story-note {
  background: rgba(245, 240, 230, .72) !important;
  padding: 18px 24px 0 !important;
}

@media (max-width:980px) {
  .bath-story-overlay {
    background:
      linear-gradient(180deg, rgba(20, 38, 32, .38) 0%, rgba(20, 38, 32, .18) 38%, rgba(245, 240, 230, .88) 74%, rgba(245, 240, 230, .97) 100%) !important;
  }

  .bath-story-intro {
    padding-top: 58px !important;
  }

  .bath-story-label-vert {
    min-height: auto !important;
    padding: 16px 18px !important;
    background: rgba(22, 49, 42, .36) !important;
  }

  .bath-story-copy {
    padding: 30px 24px !important;
    background: rgba(19, 45, 39, .44) !important;
  }

  .bath-story-copy h2 {
    font-size: 29px !important;
    line-height: 1.62 !important;
  }

  .bath-story-copy p {
    font-size: 15px !important;
    line-height: 2.05 !important;
  }

  .bath-story-aside {
    padding-top: 22px !important;
  }

  .bath-story-mini-water {
    width: 55% !important;
    height: 170px !important;
    margin-top: 34px !important;
  }

  .bath-story-mini-shoji {
    width: 40% !important;
    height: 220px !important;
  }
}



/* ① ファーストビュー直下の導入文を右側の読みやすい領域に収める */
@media (min-width: 981px) {
  .intro {
    padding: 110px 5vw 82px !important;
  }

  .intro-grid {
    grid-template-columns: minmax(560px, 1.05fr) minmax(360px, 440px) !important;
    gap: clamp(64px, 8vw, 130px) !important;
    align-items: start !important;
  }

  .intro h2 {
    font-size: clamp(42px, 3.5vw, 58px) !important;
    line-height: 1.62 !important;
    letter-spacing: .10em !important;
    max-width: 880px !important;
  }

  .intro p {
    max-width: 430px !important;
    margin: 0 0 0 auto !important;
    font-size: 17px !important;
    line-height: 2.18 !important;
    letter-spacing: .03em !important;
  }

  .intro:after {
    right: 1.5vw !important;
    top: 8px !important;
    font-size: 11.5vw !important;
    opacity: .9 !important;
  }
}

@media (max-width: 980px) {
  .intro-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  .intro p {
    max-width: none !important;
    font-size: 15px !important;
    line-height: 2.05 !important;
  }
}

/* ② 不感温浴セクションを大きく再構成 */
.bathing-method.bath-story {
  min-height: auto !important;
  padding: 120px 0 88px !important;
  background: #ded9cc !important;
}

.bath-story:before {
  content: "BATHING" !important;
  left: 50% !important;
  top: 32px !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  font-size: 12vw !important;
  line-height: 1 !important;
  color: rgba(135, 145, 129, .10) !important;
  z-index: 0 !important;
}

.bath-story-bg {
  position: absolute !important;
  left: 0 !important;
  top: 132px !important;
  right: auto !important;
  bottom: auto !important;
  width: min(53vw, 760px) !important;
  height: 500px !important;
  background-position: center center !important;
  background-size: cover !important;
  filter: none !important;
  opacity: 1 !important;
  border-radius: 0 !important;
  box-shadow: 0 34px 70px rgba(40, 30, 20, .16) !important;
}

.bath-story-overlay {
  background: none !important;
}

.bath-story-intro {
  position: relative !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: 110px minmax(0, 1fr) !important;
  column-gap: 34px !important;
  align-items: start !important;
  width: min(1120px, calc(100% - 10vw)) !important;
  margin: 0 5vw 0 auto !important;
  padding: 0 !important;
}

.bath-story-label-vert {
  writing-mode: vertical-rl !important;
  text-orientation: mixed !important;
  color: #7f8f75 !important;
  padding-top: 36px !important;
  gap: 10px !important;
  background: none !important;
  min-height: 0 !important;
}

.bath-story-label-vert span {
  display: none !important;
}

.bath-story-label-vert strong {
  font-size: 13px !important;
  letter-spacing: .34em !important;
  line-height: 1.8 !important;
  color: #7f8f75 !important;
}

.bath-story-copy {
  margin-left: auto !important;
  width: min(660px, 100%) !important;
  background: rgba(247, 243, 235, .97) !important;
  color: #544e45 !important;
  padding: 62px 72px 56px !important;
  box-shadow: 0 24px 70px rgba(44, 36, 26, .10) !important;
  border: 1px solid rgba(196, 190, 177, .8) !important;
}

.bath-story-copy .kicker {
  display: block !important;
  margin: 0 0 28px !important;
  font-family: Georgia, serif !important;
  font-size: 15px !important;
  letter-spacing: .34em !important;
  color: #8a9981 !important;
}

.bath-story-copy h2 {
  margin: 0 0 28px !important;
  color: #1e5146 !important;
  text-shadow: none !important;
  font-size: 52px !important;
  line-height: 1.4 !important;
  letter-spacing: .08em !important;
}

.bath-story-copy h2 span {
  display: block;
}

.bath-story-copy p {
  max-width: 520px !important;
  margin: 0 0 18px !important;
  color: #595248 !important;
  text-shadow: none !important;
  font-size: 17px !important;
  line-height: 2.18 !important;
}

.bath-story-aside {
  position: absolute !important;
  left: 0 !important;
  top: 454px !important;
  z-index: 3 !important;
  display: grid !important;
  grid-template-columns: minmax(210px, 300px) minmax(170px, 220px) !important;
  gap: 18px !important;
  width: min(49vw, 680px) !important;
  padding: 0 0 0 5vw !important;
  justify-content: start !important;
  align-items: end !important;
}

.bath-story-mini {
  border: none !important;
  box-shadow: 0 18px 42px rgba(40, 33, 23, .18) !important;
  background-size: cover !important;
  background-position: center !important;
}

.bath-story-mini-water {
  width: 100% !important;
  height: 216px !important;
  margin-top: 0 !important;
}

.bath-story-mini-shoji {
  width: 100% !important;
  height: 278px !important;
}

.bath-story-steps {
  position: relative !important;
  z-index: 4 !important;
  margin: 86px 5vw 0 auto !important;
  width: min(1120px, calc(100% - 10vw)) !important;
  background: rgba(246, 242, 234, .96) !important;
  border: 1px solid rgba(197, 190, 176, .8) !important;
  box-shadow: 0 24px 54px rgba(43, 36, 26, .08) !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.bath-story-step {
  padding: 38px 34px 34px !important;
  border-right: 1px solid rgba(202, 194, 181, .86) !important;
}

.bath-story-step span {
  font-size: 13px !important;
  letter-spacing: .28em !important;
  color: #8a9981 !important;
  margin-bottom: 14px !important;
}

.bath-story-step h3 {
  font-size: 28px !important;
  line-height: 1.7 !important;
  letter-spacing: .06em !important;
  color: #264f45 !important;
  margin: 0 0 12px !important;
}

.bath-story-step p {
  font-size: 16px !important;
  line-height: 2.05 !important;
  color: #5d564c !important;
}

.bath-story-note {
  position: relative !important;
  z-index: 4 !important;
  width: min(1120px, calc(100% - 10vw)) !important;
  margin: 18px 5vw 0 auto !important;
  color: #6d665d !important;
  font-size: 14px !important;
  line-height: 2.05 !important;
  padding: 18px 6px 0 !important;
  border-top: 1px solid rgba(190, 182, 168, .85) !important;
  background: none !important;
}

@media (max-width: 1200px) {
  .bath-story-copy {
    padding: 52px 48px 48px !important;
  }

  .bath-story-copy h2 {
    font-size: 44px !important;
  }

  .bath-story-aside {
    width: min(46vw, 560px) !important;
  }
}

@media (max-width: 980px) {
  .bathing-method.bath-story {
    padding: 64px 0 56px !important;
  }

  .bath-story:before {
    top: 18px !important;
    font-size: 18vw !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }

  .bath-story-bg {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: calc(100% - 48px) !important;
    height: 320px !important;
    margin: 0 24px 0 !important;
  }

  .bath-story-intro {
    width: calc(100% - 48px) !important;
    margin: 24px auto 0 !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .bath-story-label-vert {
    writing-mode: horizontal-tb !important;
    padding-top: 0 !important;
  }

  .bath-story-copy {
    width: 100% !important;
    padding: 30px 24px 28px !important;
  }

  .bath-story-copy .kicker {
    font-size: 12px !important;
    letter-spacing: .26em !important;
    margin-bottom: 18px !important;
  }

  .bath-story-copy h2 {
    font-size: 30px !important;
    line-height: 1.62 !important;
  }

  .bath-story-copy p {
    font-size: 15px !important;
    line-height: 2.02 !important;
    max-width: none !important;
  }

  .bath-story-aside {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: calc(100% - 48px) !important;
    padding: 18px 24px 0 !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
  }

  .bath-story-mini-water {
    height: 150px !important;
  }

  .bath-story-mini-shoji {
    height: 190px !important;
  }

  .bath-story-steps {
    width: calc(100% - 48px) !important;
    margin: 28px auto 0 !important;
    grid-template-columns: 1fr !important;
  }

  .bath-story-step {
    border-right: none !important;
    border-bottom: 1px solid rgba(202, 194, 181, .86) !important;
  }

  .bath-story-step:last-child {
    border-bottom: none !important;
  }

  .bath-story-step h3 {
    font-size: 24px !important;
  }

  .bath-story-note {
    width: calc(100% - 48px) !important;
    margin: 16px auto 0 !important;
    padding: 16px 0 0 !important;
  }
}



/* v14: 赤枠指示は右側本文のみ。左見出しサイズは元のバランスへ戻す */
@media (min-width: 981px) {
  .intro-grid {
    grid-template-columns: minmax(560px, 58vw) minmax(320px, 380px) !important;
    gap: 5.5vw !important;
    align-items: start !important;
  }

  .intro h2 {
    font-size: 34px !important;
    line-height: 1.85 !important;
    font-weight: 400 !important;
    letter-spacing: .08em !important;
    color: #2f322d !important;
    margin: 24px 0 0 !important;
    max-width: 22em !important;
    word-break: normal !important;
    line-break: strict !important;
  }

  .intro p {
    max-width: 360px !important;
    margin: 0 0 0 auto !important;
    font-size: 16px !important;
    line-height: 2.2 !important;
    letter-spacing: .02em !important;
    color: #5b5a53 !important;
    word-break: normal !important;
    line-break: strict !important;
  }
}

@media (max-width: 980px) {
  .intro h2 {
    font-size: 29px !important;
    line-height: 1.75 !important;
    letter-spacing: .06em !important;
    max-width: none !important;
  }

  .intro p {
    max-width: none !important;
    font-size: 15px !important;
    line-height: 2.05 !important;
  }
}



.intro {
  padding: 120px 5vw 90px !important;
}

.intro-grid {
  grid-template-columns: minmax(560px, 1fr) minmax(330px, 420px) !important;
  gap: 6vw !important;
  align-items: start !important;
}

.intro h2 {
  margin-top: 28px !important;
}

.intro p {
  max-width: 420px !important;
  justify-self: end !important;
  font-size: 16px !important;
  line-height: 2.35 !important;
  padding-top: 8px !important;
}

.bath-editorial {
  position: relative;
  padding: 26px 0 92px;
  background: #ddd8cc;
  overflow: hidden;
}

.bath-editorial::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 22px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(0, 0, 0, .03));
}

.bath-editorial-hero-frame {
  padding: 0 22px;
}

.bath-editorial-hero {
  position: relative;
  margin: 0;
  border: 1px solid rgba(40, 35, 29, .45);
  box-shadow: 0 10px 30px rgba(50, 40, 28, .10);
  overflow: hidden;
  background: #000;
}

.bath-editorial-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(27, 25, 22, .35);
}

.bath-editorial-hero img {
  display: block;
  width: 100%;
  height: clamp(420px, 48vw, 620px);
  object-fit: cover;
  object-position: center center;
  filter: saturate(.88) brightness(.80);
}

.bath-editorial-hero-copy {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  color: #fff;
  pointer-events: none;
}

.bath-editorial-hero-copy .hero-copy-main,
.bath-editorial-hero-copy .hero-copy-sub {
  writing-mode: vertical-rl;
  text-orientation: mixed;
}

.bath-editorial-hero-copy .hero-copy-main {
  font-size: 48px;
  line-height: 1.45;
  letter-spacing: .14em;
  font-weight: 400;
  text-shadow: 0 8px 20px rgba(0, 0, 0, .32);
}

.bath-editorial-hero-copy .hero-copy-sub {
  font-size: 18px;
  line-height: 2.2;
  letter-spacing: .12em;
  opacity: .92;
  text-shadow: 0 6px 16px rgba(0, 0, 0, .28);
}

.bath-editorial-lower {
  margin-top: 18px;
  padding: 0 22px;
  display: grid;
  grid-template-columns: minmax(420px, 38.5%) minmax(0, 1fr);
  gap: 0;
}

.bath-editorial-collage {
  display: grid;
  grid-template-rows: 1.1fr .82fr;
  min-height: 740px;
  background: #c6c1b5;
}

.bath-editorial-collage figure,
.bath-editorial-collage .small {
  margin: 0;
  overflow: hidden;
  position: relative;
}

.bath-editorial-collage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.collage-main {
  border-right: 1px solid rgba(38, 33, 28, .14);
  border-bottom: 1px solid rgba(38, 33, 28, .14);
}

.collage-grid-small {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  grid-template-rows: 1fr 1fr;
}

.collage-grid-small .s1 {
  border-right: 1px solid rgba(38, 33, 28, .14);
  border-bottom: 1px solid rgba(38, 33, 28, .14);
}

.collage-grid-small .s2 {
  grid-row: 1/3;
  grid-column: 2;
  border-left: 1px solid rgba(38, 33, 28, .14);
}

.collage-grid-small .s3 {
  border-right: 1px solid rgba(38, 33, 28, .14);
}

.bath-editorial-paper {
  position: relative;
  min-height: 740px;
  background: linear-gradient(180deg, rgba(250, 248, 243, .76), rgba(239, 236, 228, .96));
  border: 1px solid rgba(38, 33, 28, .10);
  border-left: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28);
  overflow: hidden;
}

.bath-editorial-paper::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 18%, rgba(255, 255, 255, .18), transparent 30%), radial-gradient(circle at 80% 72%, rgba(0, 0, 0, .03), transparent 32%), repeating-linear-gradient(0deg, rgba(0, 0, 0, .008) 0 2px, rgba(255, 255, 255, 0) 2px 4px);
  pointer-events: none;
}

.paper-textblock {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(300px, 420px);
  gap: 72px;
  padding: 86px 78px 0 78px;
}

.paper-kicker {
  font-family: Georgia, serif;
  font-size: 13px;
  letter-spacing: .34em;
  color: #8a9882;
  margin-bottom: 22px;
}

.paper-title-wrap h2 {
  margin: 0;
  color: #214c42;
  font-size: 56px;
  line-height: 1.7;
  font-weight: 400;
  letter-spacing: .12em;
}

.paper-copy {
  max-width: 390px;
  justify-self: end;
  padding-top: 6px;
}

.paper-copy p {
  margin: 0 0 26px;
  font-size: 17px;
  line-height: 2.35;
  letter-spacing: .03em;
  color: #4f4b45;
}

.paper-copy p:last-child {
  margin-bottom: 0;
}

.paper-steps {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 62px 78px 0;
  border-top: 1px solid rgba(40, 35, 29, .12);
  border-bottom: 1px solid rgba(40, 35, 29, .12);
}

.paper-step {
  padding: 28px 22px 30px 28px;
  border-right: 1px solid rgba(40, 35, 29, .12);
}

.paper-step:last-child {
  border-right: none;
}

.step-no {
  margin-bottom: 18px;
  font-family: Georgia, serif;
  font-size: 13px;
  letter-spacing: .28em;
  color: #8a9882;
}

.paper-step h3 {
  margin: 0 0 14px;
  color: #214c42;
  font-size: 28px;
  line-height: 1.72;
  font-weight: 400;
  letter-spacing: .08em;
}

.paper-step p {
  margin: 0;
  font-size: 15px;
  line-height: 2.15;
  color: #535048;
}

.paper-note {
  position: relative;
  z-index: 1;
  margin: 24px 78px 0;
  padding-top: 18px;
  border-top: 1px solid rgba(40, 35, 29, .12);
  font-size: 13px;
  line-height: 2.05;
  color: #6b665c;
}

@media (max-width:1180px) {
  .paper-textblock {
    grid-template-columns: minmax(280px, 1fr) minmax(260px, 360px);
    gap: 44px;
    padding: 70px 50px 0;
  }

  .paper-title-wrap h2 {
    font-size: 46px;
  }

  .paper-copy p {
    font-size: 16px;
  }

  .paper-steps {
    margin: 52px 50px 0;
  }

  .paper-step h3 {
    font-size: 24px;
  }

  .paper-note {
    margin: 24px 50px 0;
  }
}

@media (max-width:980px) {
  .intro {
    padding: 88px 22px 68px !important;
  }

  .intro-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .intro p {
    max-width: none !important;
    justify-self: start !important;
    padding-top: 0 !important;
  }

  .bath-editorial {
    padding: 10px 0 50px;
  }

  .bath-editorial-hero-frame,
  .bath-editorial-lower {
    padding: 0 14px;
  }

  .bath-editorial-hero img {
    height: 420px;
  }

  .bath-editorial-hero-copy {
    gap: 14px;
    right: 14px;
    justify-content: flex-end;
  }

  .bath-editorial-hero-copy .hero-copy-main {
    font-size: 28px;
  }

  .bath-editorial-hero-copy .hero-copy-sub {
    font-size: 13px;
  }

  .bath-editorial-lower {
    grid-template-columns: 1fr;
  }

  .bath-editorial-collage {
    min-height: auto;
  }

  .collage-main {
    height: 250px;
  }

  .collage-grid-small {
    grid-template-rows: 150px 150px;
  }

  .bath-editorial-paper {
    min-height: auto;
    border-left: 1px solid rgba(38, 33, 28, .10);
  }

  .paper-textblock {
    display: block;
    padding: 34px 24px 0;
  }

  .paper-title-wrap h2 {
    font-size: 32px;
    line-height: 1.65;
  }

  .paper-copy {
    max-width: none;
    padding-top: 18px;
  }

  .paper-copy p {
    font-size: 15px;
    line-height: 2.05;
  }

  .paper-steps {
    grid-template-columns: 1fr;
    margin: 28px 24px 0;
  }

  .paper-step {
    border-right: none;
    border-bottom: 1px solid rgba(40, 35, 29, .12);
    padding: 22px 4px 20px;
  }

  .paper-step:last-child {
    border-bottom: none;
  }

  .paper-step h3 {
    font-size: 21px;
    line-height: 1.7;
  }

  .paper-step p {
    font-size: 14px;
    line-height: 1.95;
  }

  .paper-note {
    margin: 18px 24px 0 24px;
    font-size: 12px;
  }
}



/* v18: 見出しの段落ちを整え、STEPをエディトリアル寄りに再設計 */
.paper-textblock {
  grid-template-columns: minmax(360px, 1.08fr) minmax(280px, .92fr) !important;
  gap: 56px !important;
  align-items: start !important;
}

.paper-title-wrap h2 {
  margin: 0 !important;
  color: #234f46 !important;
  font-size: clamp(44px, 4.9vw, 74px) !important;
  line-height: 1.52 !important;
  letter-spacing: .05em !important;
  font-weight: 400 !important;
  max-width: 7.9em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.paper-title-wrap h2 span {
  display: block !important;
}

.paper-copy {
  max-width: 430px !important;
  justify-self: end !important;
  padding-top: 8px !important;
}

.paper-copy p {
  font-size: 16px !important;
  line-height: 2.15 !important;
  letter-spacing: .025em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

.paper-steps {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 42px !important;
  margin: 58px 78px 0 !important;
  padding-top: 28px !important;
  border: none !important;
  background: none !important;
}

.paper-steps::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  height: 1px !important;
  background: rgba(54, 48, 40, .16) !important;
}

.paper-step {
  position: relative !important;
  padding: 32px 0 0 !important;
  border: none !important;
  background: transparent !important;
  min-height: 0 !important;
}

.paper-step::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: -6px !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 999px !important;
  background: #234f46 !important;
  box-shadow: 0 0 0 6px rgba(35, 79, 70, .10) !important;
}

.paper-step:nth-child(2) {
  padding-top: 58px !important;
}

.paper-step:nth-child(2)::before {
  top: 20px !important;
}

.paper-step:nth-child(3) {
  padding-top: 96px !important;
}

.paper-step:nth-child(3)::before {
  top: 58px !important;
}

.step-no {
  margin-bottom: 16px !important;
  padding-left: 22px !important;
  font-size: 12px !important;
  letter-spacing: .28em !important;
  color: #8a9882 !important;
}

.paper-step h3 {
  margin: 0 0 14px !important;
  color: #234f46 !important;
  font-size: clamp(27px, 2vw, 34px) !important;
  line-height: 1.58 !important;
  letter-spacing: .04em !important;
  font-weight: 400 !important;
  max-width: 8.4em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.paper-step p {
  margin: 0 !important;
  max-width: 15.5em !important;
  color: #57534b !important;
  font-size: 15px !important;
  line-height: 2.0 !important;
  letter-spacing: .01em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

.paper-note {
  margin: 34px 78px 0 !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(54, 48, 40, .16) !important;
  font-size: 13px !important;
  line-height: 2.0 !important;
}

@media (max-width:1180px) {
  .paper-textblock {
    gap: 40px !important;
    padding: 64px 50px 0 !important;
  }

  .paper-title-wrap h2 {
    font-size: clamp(40px, 4.3vw, 58px) !important;
    max-width: 8.2em !important;
  }

  .paper-copy p {
    font-size: 15.5px !important;
  }

  .paper-steps {
    margin: 52px 50px 0 !important;
    gap: 28px !important;
  }

  .paper-step h3 {
    font-size: 26px !important;
  }

  .paper-note {
    margin: 28px 50px 0 !important;
  }
}

@media (max-width:980px) {
  .paper-textblock {
    display: block !important;
    padding: 34px 24px 0 !important;
  }

  .paper-title-wrap h2 {
    font-size: clamp(34px, 8vw, 46px) !important;
    line-height: 1.58 !important;
    max-width: 8.6em !important;
  }

  .paper-title-wrap h2 span {
    display: inline !important;
  }

  .paper-copy {
    max-width: none !important;
    padding-top: 20px !important;
  }

  .paper-copy p {
    font-size: 14.5px !important;
    line-height: 2.02 !important;
  }

  .paper-steps {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    margin: 30px 24px 0 !important;
    padding-top: 0 !important;
  }

  .paper-steps::before {
    display: none !important;
  }

  .paper-step,
  .paper-step:nth-child(2),
  .paper-step:nth-child(3) {
    padding: 24px 0 24px 28px !important;
  }

  .paper-step {
    border-top: 1px solid rgba(54, 48, 40, .16) !important;
  }

  .paper-step::before,
  .paper-step:nth-child(2)::before,
  .paper-step:nth-child(3)::before {
    left: 0 !important;
    top: 31px !important;
  }

  .step-no {
    padding-left: 0 !important;
    margin-bottom: 12px !important;
  }

  .paper-step h3 {
    font-size: 24px !important;
    line-height: 1.62 !important;
    max-width: none !important;
  }

  .paper-step p {
    font-size: 14px !important;
    line-height: 1.95 !important;
    max-width: none !important;
  }

  .paper-note {
    margin: 22px 24px 0 !important;
    font-size: 12px !important;
    line-height: 1.95 !important;
  }
}



/* v19 final readability / layout fixes */
.paper-textblock {
  grid-template-columns: minmax(380px, 1.08fr) minmax(340px, .92fr) !important;
  gap: 72px !important;
  align-items: start !important;
  padding: 78px 72px 0 !important;
}

.paper-kicker {
  font-size: 12px !important;
  letter-spacing: .28em !important;
  color: #9aa690 !important;
  margin-bottom: 22px !important;
}

.paper-title-wrap h2 {
  margin: 0 !important;
  color: #234f46 !important;
  font-size: clamp(46px, 4.15vw, 64px) !important;
  line-height: 1.75 !important;
  letter-spacing: .06em !important;
  font-weight: 400 !important;
  max-width: 5.8em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  white-space: normal !important;
  text-wrap: balance !important;
}

.paper-title-wrap h2 span {
  display: block !important;
}

.paper-copy {
  max-width: 440px !important;
  justify-self: end !important;
  padding-top: 8px !important;
}

.paper-copy p {
  margin: 0 0 26px !important;
  color: #4f4b44 !important;
  font-size: 16px !important;
  line-height: 2.15 !important;
  letter-spacing: .02em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: pretty !important;
}

.paper-copy p:last-child {
  margin-bottom: 0 !important;
}

.paper-steps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  margin: 56px 72px 0 !important;
  padding-top: 26px !important;
  border-top: 1px solid rgba(54, 48, 40, .16) !important;
  border-bottom: none !important;
  background: none !important;
}

.paper-steps::before {
  display: none !important;
}

.paper-step,
.paper-step:nth-child(2),
.paper-step:nth-child(3) {
  position: relative !important;
  display: block !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: none !important;
  background: rgba(255, 255, 255, .46) !important;
  box-shadow: 0 0 0 1px rgba(54, 48, 40, .12) !important;
}

.paper-step::before,
.paper-step:nth-child(2)::before,
.paper-step:nth-child(3)::before {
  display: none !important;
}

.step-no {
  margin: 0 0 10px !important;
  padding: 24px 28px 0 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: .28em !important;
  color: #8d9a84 !important;
}

.paper-step h3 {
  margin: 0 0 14px !important;
  padding: 0 28px !important;
  color: #234f46 !important;
  font-size: clamp(24px, 1.85vw, 31px) !important;
  line-height: 1.72 !important;
  letter-spacing: .05em !important;
  font-weight: 400 !important;
  max-width: 7.5em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  white-space: normal !important;
  text-wrap: balance !important;
}

.paper-step p {
  margin: 0 !important;
  padding: 0 28px 28px !important;
  color: #5a554d !important;
  font-size: 15px !important;
  line-height: 2.0 !important;
  letter-spacing: .01em !important;
  max-width: none !important;
  word-break: keep-all !important;
  line-break: strict !important;
  white-space: normal !important;
  text-wrap: pretty !important;
}

.paper-note {
  margin: 30px 72px 0 !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(54, 48, 40, .16) !important;
  color: #6a645c !important;
  font-size: 13px !important;
  line-height: 2.0 !important;
}

.bridge {
  margin: 88px 6vw 120px !important;
  background: #2f2a25 !important;
  color: #fff !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(260px, .74fr) minmax(220px, .58fr) !important;
  min-height: 560px !important;
}

.bridge::before {
  color: rgba(255, 255, 255, .08) !important;
  bottom: -.20em !important;
}

.bridge-text {
  padding: 88px 6vw !important;
}

.bridge-text h2 {
  margin: 0 0 24px !important;
  color: #f2ece2 !important;
  font-size: clamp(34px, 3vw, 46px) !important;
  line-height: 1.82 !important;
  letter-spacing: .12em !important;
  font-weight: 400 !important;
  max-width: 8em !important;
}

.bridge-text p {
  margin: 0 !important;
  color: rgba(255, 255, 255, .86) !important;
  font-size: 16px !important;
  line-height: 2.22 !important;
  letter-spacing: .02em !important;
  max-width: 27em !important;
}

.bridge-list {
  border-left: 1px solid rgba(255, 255, 255, .16) !important;
}

.bridge-list div {
  padding: 28px 42px !important;
  color: #f3eee7 !important;
  font-size: 21px !important;
  line-height: 1.7 !important;
}

.bridge-list span {
  color: #c8d2be !important;
}

@media (max-width:1180px) {
  .paper-textblock {
    grid-template-columns: minmax(300px, 1fr) minmax(280px, .9fr) !important;
    gap: 50px !important;
    padding: 68px 50px 0 !important;
  }

  .paper-title-wrap h2 {
    font-size: clamp(42px, 4.2vw, 56px) !important;
    max-width: 6.2em !important;
  }

  .paper-steps {
    margin: 50px 50px 0 !important;
    gap: 18px !important;
  }

  .paper-step h3 {
    font-size: 26px !important;
  }

  .paper-note {
    margin: 28px 50px 0 !important;
  }
}

@media (max-width:980px) {
  .paper-textblock {
    display: block !important;
    padding: 36px 22px 0 !important;
  }

  .paper-title-wrap h2 {
    font-size: clamp(34px, 8.4vw, 44px) !important;
    line-height: 1.68 !important;
    max-width: 7.2em !important;
  }

  .paper-title-wrap h2 span {
    display: inline !important;
  }

  .paper-copy {
    max-width: none !important;
    padding-top: 18px !important;
  }

  .paper-copy p {
    font-size: 14.5px !important;
    line-height: 2.05 !important;
  }

  .paper-steps {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin: 28px 22px 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
  }

  .paper-step,
  .paper-step:nth-child(2),
  .paper-step:nth-child(3) {
    padding: 0 !important;
  }

  .step-no {
    padding: 20px 20px 0 !important;
  }

  .paper-step h3 {
    padding: 0 20px !important;
    font-size: 23px !important;
    line-height: 1.66 !important;
    max-width: none !important;
  }

  .paper-step p {
    padding: 0 20px 20px !important;
    font-size: 14px !important;
    line-height: 1.95 !important;
  }

  .paper-note {
    margin: 22px 22px 0 !important;
    font-size: 12px !important;
    line-height: 1.9 !important;
  }

  .bridge {
    display: block !important;
    margin: 70px 0 90px !important;
    min-height: auto !important;
  }

  .bridge-text {
    padding: 62px 24px 30px !important;
  }

  .bridge-text h2 {
    font-size: 30px !important;
    line-height: 1.74 !important;
  }

  .bridge-text p {
    font-size: 15px !important;
    line-height: 2.06 !important;
    max-width: none !important;
  }
}



/* v20 - final layout correction placed at end so it wins */
.bath-editorial-paper {
  background: linear-gradient(180deg, rgba(249, 247, 241, .92), rgba(241, 238, 230, .98)) !important;
}

.paper-textblock {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 580px) minmax(0, 430px) !important;
  justify-content: space-between !important;
  align-items: start !important;
  gap: 60px !important;
  padding: 82px 68px 0 !important;
}

.paper-title-wrap {
  max-width: 580px !important;
}

.paper-kicker {
  margin-bottom: 28px !important;
  font-size: 11px !important;
  letter-spacing: .30em !important;
  color: #9ca78f !important;
}

.paper-title-wrap h2 {
  margin: 0 !important;
  color: #234f46 !important;
  font-size: clamp(38px, 3.2vw, 54px) !important;
  line-height: 1.72 !important;
  letter-spacing: .06em !important;
  font-weight: 400 !important;
  max-width: 9.2em !important;
}

.paper-title-wrap h2 .line {
  display: block !important;
}

.paper-title-wrap h2 .line+.line {
  margin-top: .32em !important;
}

.paper-copy {
  max-width: 430px !important;
  width: 100% !important;
  justify-self: end !important;
  padding-top: 4px !important;
}

.paper-copy p {
  margin: 0 0 24px !important;
  color: #4e4a43 !important;
  font-size: 17px !important;
  line-height: 2.25 !important;
  letter-spacing: .01em !important;
  word-break: keep-all !important;
  line-break: strict !important;
}

.paper-copy p:last-child {
  margin-bottom: 0 !important;
}

.paper-steps {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
  margin: 56px 68px 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
  border-bottom: none !important;
}

.paper-step {
  background: rgba(255, 255, 255, .52) !important;
  border: 1px solid rgba(53, 47, 39, .13) !important;
  box-shadow: none !important;
  min-height: 0 !important;
  padding: 30px 28px 26px !important;
}

.paper-step:last-child {
  border-right: 1px solid rgba(53, 47, 39, .13) !important;
}

.step-no {
  margin: 0 0 18px !important;
  font-size: 11px !important;
  letter-spacing: .28em !important;
  color: #95a18b !important;
}

.paper-step h3 {
  margin: 0 0 18px !important;
  color: #234f46 !important;
  font-size: clamp(26px, 2.0vw, 34px) !important;
  line-height: 1.65 !important;
  letter-spacing: .04em !important;
  font-weight: 400 !important;
  max-width: 8em !important;
}

.paper-step h3 .line {
  display: block !important;
}

.paper-step h3 .line+.line {
  margin-top: .18em !important;
}

.paper-step p {
  margin: 0 !important;
  color: #5a554d !important;
  font-size: 15px !important;
  line-height: 2.0 !important;
  letter-spacing: .01em !important;
}

.paper-note {
  margin: 30px 68px 0 !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(53, 47, 39, .13) !important;
  font-size: 13px !important;
  line-height: 1.95 !important;
  color: #6a655c !important;
}

.bridge {
  background: #302b26 !important;
}

.bridge::before {
  color: rgba(255, 255, 255, .06) !important;
}

.bridge-text h2 {
  color: #f0ebe2 !important;
  font-size: clamp(32px, 2.6vw, 42px) !important;
  line-height: 1.85 !important;
  letter-spacing: .10em !important;
  max-width: 7em !important;
}

.bridge-text p {
  color: rgba(255, 255, 255, .86) !important;
  font-size: 16px !important;
  line-height: 2.2 !important;
  max-width: 28em !important;
}

@media (max-width: 1100px) {
  .paper-textblock {
    grid-template-columns: minmax(0, 1fr) minmax(0, 360px) !important;
    gap: 40px !important;
    padding: 64px 40px 0 !important;
  }

  .paper-title-wrap h2 {
    font-size: clamp(34px, 4.0vw, 46px) !important;
    max-width: 8.5em !important;
  }

  .paper-steps {
    margin: 44px 40px 0 !important;
    gap: 18px !important;
  }

  .paper-step {
    padding: 24px 20px 22px !important;
  }

  .paper-step h3 {
    font-size: 28px !important;
  }

  .paper-note {
    margin: 24px 40px 0 !important;
  }
}

@media (max-width: 900px) {
  .paper-textblock {
    display: block !important;
    padding: 36px 22px 0 !important;
  }

  .paper-title-wrap h2 {
    font-size: 32px !important;
    line-height: 1.65 !important;
    max-width: none !important;
  }

  .paper-copy {
    max-width: none !important;
    padding-top: 18px !important;
  }

  .paper-copy p {
    font-size: 15px !important;
    line-height: 2.0 !important;
  }

  .paper-steps {
    grid-template-columns: 1fr !important;
    margin: 34px 22px 0 !important;
    gap: 14px !important;
  }

  .paper-step {
    padding: 22px 18px 20px !important;
  }

  .paper-step h3 {
    font-size: 24px !important;
    max-width: none !important;
  }

  .paper-step p {
    font-size: 14px !important;
    line-height: 1.9 !important;
  }

  .paper-note {
    margin: 20px 22px 0 !important;
    font-size: 12px !important;
  }
}



/*html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}


h1,
h2,
h3,
h4,
p,
li,
dt,
dd {
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word;
}*/

@media (max-width: 820px) {
  /*body {
    overflow-x: hidden !important;
  }*/

  .sp {
    display: block !important
  }

  .pc {
    display: none !important
  }

  .intro {
    padding: 72px 24px 56px !important;
  }

  .intro:after {
    font-size: 20vw !important;
    top: 42px !important;
    right: -.08em !important;
    color: rgba(143, 157, 134, .07) !important;
  }

  .intro .kicker {
    font-size: 14px !important;
    letter-spacing: .22em !important;
  }

  .intro h2 {
    margin-top: 18px !important;
    font-size: clamp(28px, 9vw, 42px) !important;
    line-height: 1.72 !important;
    letter-spacing: .04em !important;
    max-width: 6.4em !important;
  }

  .intro p {
    margin-top: 28px !important;
    font-size: 15px !important;
    line-height: 2.02 !important;
    letter-spacing: .01em !important;
    max-width: none !important;
  }

  .dynamic-section,
  .dynamic-section.reverse {
    display: block !important;
    min-height: auto !important;
    margin: 0 0 72px !important;
    padding: 0 !important;
  }

  .dynamic-section .visual,
  .dynamic-section.reverse .visual {
    grid-column: auto !important;
    grid-row: auto !important;
    min-height: 260px !important;
    height: 260px !important;
    width: 100% !important;
  }

  .dynamic-section .visual:after {
    background: linear-gradient(180deg, transparent 60%, rgba(0, 0, 0, .22)), repeating-linear-gradient(90deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 58px) !important;
  }

  .dynamic-section .text,
  .dynamic-section.reverse .text {
    grid-column: auto !important;
    position: relative !important;
    margin: -24px 20px 0 !important;
    padding: 30px 22px 28px !important;
    background: #f7f2e8 !important;
    z-index: 3 !important;
  }

  .dynamic-section .ghost {
    display: none !important;
  }

  .dynamic-section .text .label,
  .dynamic-section .text .kicker {
    font-size: 12px !important;
    letter-spacing: .22em !important;
  }

  .dynamic-section .text h2 {
    font-size: clamp(30px, 7.8vw, 40px) !important;
    line-height: 1.65 !important;
    letter-spacing: .04em !important;
    max-width: 7em !important;
    margin: 0 0 18px !important;
  }

  .dynamic-section .text p {
    font-size: 15px !important;
    line-height: 2.02 !important;
    letter-spacing: .01em !important;
    max-width: none !important;
  }

  .bridge {
    display: block !important;
  }

  .bridge-photo {
    min-height: 320px !important;
  }

  .bridge-text {
    padding: 46px 24px 42px !important;
  }

  .bridge-text h2 {
    font-size: clamp(30px, 8vw, 40px) !important;
    line-height: 1.76 !important;
    letter-spacing: .08em !important;
    max-width: 7em !important;
    margin-bottom: 22px !important;
  }

  .bridge-text p {
    font-size: 15px !important;
    line-height: 2.1 !important;
    letter-spacing: .01em !important;
    max-width: none !important;
  }

  .bridge-list {
    border-left: none !important;
  }

  .bridge-list div {
    padding: 22px 24px !important;
    font-size: 18px !important;
  }

  .timeline {
    padding: 72px 24px 88px !important;
  }

  .timeline:before {
    font-size: 20vw !important;
    top: 54px !important;
    right: -.1em !important;
    color: rgba(143, 157, 134, .08) !important;
  }

  .timeline h2 {
    font-size: clamp(30px, 8vw, 40px) !important;
    line-height: 1.7 !important;
    letter-spacing: .08em !important;
    max-width: 6em !important;
    margin: 0 0 38px !important;
  }

  .time-grid {
    max-width: none !important;
  }

  .time-grid:before {
    left: 56px !important;
    top: 8px !important;
    bottom: 8px !important;
  }

  .time-card {
    display: block !important;
    padding: 0 0 38px 108px !important;
    min-height: 0 !important;
  }

  .time-card:before {
    left: 48px !important;
    top: 8px !important;
    width: 16px !important;
    height: 16px !important;
    box-shadow: 0 0 0 6px var(--paper2) !important;
  }

  .time {
    width: 40px !important;
    left: 0 !important;
    top: -2px !important;
    font-size: 15px !important;
    letter-spacing: .08em !important;
  }

  .time-card h3 {
    font-size: clamp(24px, 7vw, 32px) !important;
    line-height: 1.7 !important;
    margin: 0 0 14px !important;
    letter-spacing: .04em !important;
    max-width: 7em !important;
  }

  .time-card p {
    font-size: 15px !important;
    line-height: 2.02 !important;
    letter-spacing: .01em !important;

  }

  .time-photo {
    width: 100% !important;
    height: 220px !important;
    margin-top: 18px !important;
  }

  .bath-editorial {
    padding: 10px 0 42px !important;
  }

  .bath-editorial-hero-frame,
  .bath-editorial-lower {
    padding: 0 16px !important;
  }

  .bath-editorial-hero img {
    height: 360px !important;
  }

  .paper-textblock {
    display: block !important;
    padding: 34px 22px 0 !important;
  }

  .paper-kicker {
    font-size: 11px !important;
    letter-spacing: .24em !important;
    margin-bottom: 18px !important;
  }

  .paper-title-wrap h2 {
    font-size: clamp(30px, 8vw, 40px) !important;
    line-height: 1.68 !important;
    letter-spacing: .05em !important;
    max-width: 7em !important;
  }

  .paper-copy {
    max-width: none !important;
    padding-top: 16px !important;
  }

  .paper-copy p {
    font-size: 15px !important;
    line-height: 2.05 !important;
    letter-spacing: .01em !important;
    margin-bottom: 16px !important;
  }

  .paper-steps {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin: 30px 22px 0 !important;
    border: none !important;
  }

  .paper-step {
    border: 1px solid rgba(53, 47, 39, .13) !important;
    padding: 22px 18px 20px !important;
    background: rgba(255, 255, 255, .56) !important;
  }

  .paper-step h3 {
    font-size: 24px !important;
    line-height: 1.66 !important;
    letter-spacing: .04em !important;
    max-width: 6em !important;
    margin-bottom: 12px !important;
  }

  .paper-step p {
    font-size: 14px !important;
    line-height: 1.92 !important;
    letter-spacing: .01em !important;
  }

  .paper-note {
    margin: 18px 22px 0 !important;
    padding-top: 14px !important;
    font-size: 12px !important;
    line-height: 1.9 !important;
  }

  .seasonal-note {
    padding: 0 0 64px !important;
  }

  .seasonal-note-inner {
    min-height: auto !important;
    padding: 0 0 58px !important;
  }

  .seasonal-main {
    left: 20px !important;
    width: calc(100% - 20px) !important;
    height: 260px !important;
  }

  .seasonal-sub {
    width: 76% !important;
    height: 180px !important;
    margin: -24px 18px 0 auto !important;
  }

  .seasonal-copy {
    padding: 34px 22px 36px !important;
    margin: -18px 20px 0 0 !important;
  }

  .seasonal-copy h2 {
    font-size: clamp(30px, 8vw, 38px) !important;
    line-height: 1.6 !important;
    letter-spacing: .04em !important;
    margin-bottom: 18px !important;
    max-width: 7em !important;
  }

  .seasonal-copy h2 .jp {
    margin-top: 18px !important;
    font-size: 15px !important;
    line-height: 2.0 !important;
    letter-spacing: .02em !important;
    max-width: none !important;
  }

  .seasonal-note p {
    font-size: 15px !important;
    line-height: 2.02 !important;
    letter-spacing: .01em !important;
  }

  .prefooter {
    min-height: 420px !important;
  }

  .prefooter-box {
    width: auto !important;
    margin: 0 !important;
    padding: 48px 24px !important;
  }
}

@media (max-width: 480px) {

  .intro,
  .timeline,
  .bridge-text {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .intro h2,
  .timeline h2,
  .bridge-text h2,
  .paper-title-wrap h2,
  .seasonal-copy h2,
  .dynamic-section .text h2 {
    font-size: 28px !important;
    max-width: 6.2em !important;
  }

  .time-grid:before {
    left: 50px !important;
  }

  .time-card {
    padding-left: 98px !important;
  }

  .time-card:before {
    left: 42px !important;
  }

  .paper-step h3 {
    font-size: 22px !important;
  }

  .seasonal-copy {
    padding: 30px 20px 32px !important;
  }

  .seasonal-copy h2 .jp,
  .paper-copy p,
  .intro p,
  .bridge-text p,
  .time-card p,
  .dynamic-section .text p,
  .seasonal-note p {
    font-size: 14px !important;
    line-height: 1.95 !important;
  }
}


/* ===追加調整：風鈴・朝湯・スマホ可読性=== */
.furin-section {
  background: var(--paper2);
  padding: 96px 7vw 110px;
  position: relative;
  overflow: hidden
}

.furin-inner {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr);
  gap: 56px;
  align-items: center
}

.furin-kicker,
.morning-bath-label {
  font-family: Georgia, serif;
  letter-spacing: .32em;
  color: #8f9d86;
  font-size: 14px;
  margin-bottom: 18px
}

.furin-copy h2,
.morning-bath-inner h2 {
  font-size: 38px;
  line-height: 1.75;
  letter-spacing: .12em;
  font-weight: 400;
  color: #173f35;
  margin: 0 0 24px;
  word-break: keep-all;
  line-break: strict
}

.furin-copy p,
.morning-bath-inner p {
  font-size: 16px;
  line-height: 2.15;
  color: #5b5a53;
  margin: 0 0 16px;
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word
}

.furin-copy code {
  font-family: Menlo, Consolas, monospace;
  font-size: .86em;
  background: rgba(143, 157, 134, .12);
  padding: .15em .35em;
  border-radius: 3px
}

.furin-media {
  display: grid;
  grid-template-columns: 1fr .72fr;
  gap: 18px;
  align-items: end
}

.furin-video,
.furin-doc {
  display: block;
  width: 100%;
  height: auto;
  box-shadow: 0 20px 44px rgba(35, 30, 22, .12);
  background: #e8e2d5
}

.furin-video {
  aspect-ratio: 4/5;
  object-fit: cover
}

.furin-doc {
  object-fit: cover
}

.morning-bath-section {
  background: #efe9dc;
  padding: 84px 7vw 96px
}

.morning-bath-inner {
  max-width: 980px;
  margin: 0 auto;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 48px 0
}

@media(max-width:820px) {

  /*html,
  body {
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%
  }

  h1,
  h2,
  h3,
  h4,
  p,
  li,
  dt,
  dd {
    word-break: keep-all;
    line-break: strict;
    overflow-wrap: break-word
  }*/

  .intro {
    padding: 74px 24px 58px !important
  }

  .intro h2 {
    font-size: 28px !important;
    line-height: 1.7 !important;
    letter-spacing: .06em !important;
    max-width: 7em !important
  }

  .intro p {
    font-size: 15px !important;
    line-height: 2.02 !important;
    max-width: none !important
  }

  .dynamic-section,
  .dynamic-section.reverse {
    display: block !important;
    min-height: auto !important;
    margin-bottom: 72px !important
  }

  .visual,
  .dynamic-section.reverse .visual {
    width: 100% !important;
    min-height: 260px !important;
    height: 260px !important;
    margin: 0 !important
  }

  .text,
  .dynamic-section.reverse .text {
    width: auto !important;
    margin: -24px 20px 0 !important;
    padding: 32px 22px 30px !important
  }

  .text h3 {
    font-size: 27px !important;
    line-height: 1.65 !important;
    letter-spacing: .06em !important;
    max-width: 7em !important
  }

  .text p,
  .mini-note {
    font-size: 15px !important;
    line-height: 2.02 !important;
    letter-spacing: .01em !important
  }

  .bath-editorial-hero-frame,
  .bath-editorial-lower {
    padding: 0 16px !important
  }

  .paper-textblock {
    display: block !important;
    padding: 34px 22px 0 !important
  }

  .paper-title-wrap h2 {
    font-size: 30px !important;
    line-height: 1.68 !important;
    letter-spacing: .05em !important;
    max-width: 7em !important
  }

  .paper-copy p {
    font-size: 15px !important;
    line-height: 2.02 !important
  }

  .paper-steps {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin: 30px 22px 0 !important
  }

  .paper-step {
    padding: 22px 18px 20px !important
  }

  .paper-step h3 {
    font-size: 23px !important;
    line-height: 1.65 !important;
    max-width: 7em !important
  }

  .paper-step p {
    font-size: 14px !important;
    line-height: 1.92 !important
  }

  .bridge {
    display: block !important;
    margin: 70px 0 86px !important
  }

  .bridge-text {
    padding: 52px 24px 42px !important
  }

  .bridge-text h2 {
    font-size: 30px !important;
    line-height: 1.75 !important;
    max-width: 7em !important
  }

  .bridge-text p {
    font-size: 15px !important;
    line-height: 2.05 !important
  }

  .bridge-list div {
    padding: 22px 24px !important;
    font-size: 18px !important
  }

  .timeline {
    padding: 72px 24px 92px !important
  }

  .timeline h2 {
    font-size: 30px !important;
    line-height: 1.7 !important;
    max-width: 7em !important
  }

  .time-grid:before {
    left: 56px !important
  }

  .time-card {
    padding-left: 108px !important
  }

  .time-card h3 {
    font-size: 25px !important;
    line-height: 1.65 !important;
    max-width: 7em !important
  }

  .time-card p {
    font-size: 15px !important;
    line-height: 2.0 !important
  }

  .time-photo {
    height: 220px !important;
    width: 100% !important
  }

  .furin-section {
    padding: 68px 24px 76px
  }

  .furin-inner {
    display: block
  }

  .furin-copy h2,
  .morning-bath-inner h2 {
    font-size: 28px;
    line-height: 1.7;
    letter-spacing: .06em;
    max-width: 7em
  }

  .furin-copy p,
  .morning-bath-inner p {
    font-size: 15px;
    line-height: 2.02
  }

  .furin-media {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 28px
  }

  .morning-bath-section {
    padding: 62px 24px 72px
  }

  .morning-bath-inner {
    padding: 36px 0
  }

  .seasonal-copy h2 {
    font-size: 28px !important;
    line-height: 1.6 !important;
    max-width: 7em !important
  }

  .seasonal-copy h2 .jp {
    font-size: 15px !important;
    line-height: 2 !important;
    letter-spacing: .02em !important
  }
}


/* v23 furin section adjustment */
.furin-section {
  background: var(--paper2);
  padding: 82px 7vw 92px;
  position: relative;
  overflow: hidden;
}

.furin-section:before {
  content: "FURIN";
  position: absolute;
  right: -.08em;
  top: 8px;
  font-family: Georgia, serif;
  font-size: 13vw;
  letter-spacing: .1em;
  line-height: 1;
  color: rgba(143, 157, 134, .07);
  pointer-events: none;
}

.furin-inner {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  gap: 56px;
  align-items: center;
  position: relative;
  z-index: 2;
}

.furin-kicker {
  font-family: Georgia, serif;
  letter-spacing: .32em;
  color: #8f9d86;
  font-size: 13px;
  margin-bottom: 18px;
}

.furin-copy h2 {
  font-size: 34px;
  line-height: 1.72;
  letter-spacing: .1em;
  font-weight: 400;
  color: #173f35;
  margin: 0 0 24px;
  word-break: keep-all;
  line-break: strict;
}

.furin-copy p {
  max-width: 43em;
  font-size: 16px;
  line-height: 2.12;
  color: #5b5a53;
  margin: 0 0 14px;
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word;
}

.furin-media {
  display: block;
  position: relative;
}

.furin-video {
  display: block;
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  background: #e8e2d5;
  box-shadow: 0 20px 44px rgba(35, 30, 22, .12);
}

.furin-doc {
  display: none !important;
}

.furin-caption {
  margin-top: 14px;
  font-size: 12px;
  line-height: 1.8;
  color: #817b70;
}

.furin-caption code {
  font-family: Menlo, Consolas, monospace;
  font-size: .92em;
  background: rgba(143, 157, 134, .12);
  padding: .15em .35em;
  border-radius: 3px;
}

@media (max-width:980px) {
  .furin-section {
    padding: 62px 24px 66px;
  }

  .furin-section:before {
    font-size: 24vw;
    top: 20px;
    color: rgba(143, 157, 134, .055);
  }

  .furin-inner {
    display: block;
    max-width: none;
  }

  .furin-kicker {
    font-size: 12px;
    letter-spacing: .26em;
  }

  .furin-copy h2 {
    font-size: 27px;
    line-height: 1.7;
    letter-spacing: .06em;
    max-width: 10em;
  }

  .furin-copy p {
    font-size: 15px;
    line-height: 2.02;
    max-width: none;
  }


  .furin-media {
    margin-top: 28px;
    max-width: 360px;
  }

  .furin-video {
    aspect-ratio: 16/10;
  }
}

/* v24 furin video inserted */
.furin-section {
  padding: 70px 7vw 78px !important;
}

.furin-section:before {
  font-size: 10vw !important;
  top: 12px !important;
  color: rgba(143, 157, 134, .045) !important;
}

.furin-inner {
  max-width: 1040px !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px) !important;
  gap: 46px !important;
}

.furin-copy h2 {
  font-size: 32px !important;
  line-height: 1.68 !important;
  margin-bottom: 20px !important;
}

.furin-copy p {
  font-size: 15px !important;
  line-height: 2.02 !important;
  margin-bottom: 12px !important;
  max-width: 40em !important;
}

.furin-media {
  max-width: 360px !important;
  justify-self: end !important;
}

.furin-video {
  aspect-ratio: 16/9 !important;
  border-radius: 2px !important;
  object-fit: cover !important;
  box-shadow: 0 18px 36px rgba(35, 30, 22, .12) !important;
}

.furin-caption {
  display: none !important;
}

@media (max-width:980px) {
  .furin-section {
    padding: 54px 24px 58px !important;
  }

  .furin-section:before {
    font-size: 22vw !important;
    top: 24px !important;
  }

  .furin-inner {
    display: block !important;
    max-width: none !important;
  }

  .furin-copy h2 {
    font-size: 26px !important;
    line-height: 1.7 !important;
    max-width: 10em !important;
  }

  .furin-copy p {
    font-size: 14px !important;
    line-height: 1.95 !important;
    max-width: none !important;
  }

  .furin-media {
    max-width: 320px !important;
    margin: 24px 0 0 auto !important;
  }

  .furin-video {
    aspect-ratio: 16/9 !important;
  }
}

@media (max-width:480px) {
  .furin-media {
    max-width: 86vw !important;
    margin-left: 0 !important;
  }
}


/* v25: 不感温浴を余白のある宿らしいレイアウトへ整理 */
.bath-editorial-simple {
  background: var(--paper2) !important;
  padding: 120px 7vw 130px !important;
  overflow: hidden !important;
}

.bath-editorial-simple:before,
.bath-editorial-simple:after,
.bath-editorial-simple .bath-editorial-hero-frame,
.bath-editorial-simple .bath-editorial-lower {
  display: none !important;
}

.bath-simple-inner {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(360px, .78fr) minmax(520px, 1fr);
  gap: clamp(70px, 8vw, 130px);
  align-items: start;
}

.bath-simple-image {
  margin: 0;
  width: 100%;
  height: min(620px, 52vw);
  min-height: 520px;
  overflow: hidden;
  background: #e6ded0;
}

.bath-simple-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.bath-simple-copy {
  padding: 26px 0 0;
}

.bath-simple-copy .paper-kicker {
  font-family: Georgia, serif;
  color: #8f9d86;
  letter-spacing: .32em;
  font-size: 13px;
  margin: 0 0 30px;
}

.bath-simple-copy h2 {
  margin: 0 0 40px;
  color: #173f35;
  font-weight: 400;
  font-size: clamp(38px, 3.25vw, 56px);
  line-height: 1.72;
  letter-spacing: .08em;
  word-break: keep-all;
  line-break: strict;
}

.bath-simple-copy p {
  max-width: 37em;
  margin: 0 0 22px;
  color: #4e4b44;
  font-size: 16px;
  line-height: 2.18;
  letter-spacing: .025em;
  word-break: keep-all;
  line-break: strict;
  overflow-wrap: break-word;
}

.bath-simple-steps {
  margin: 54px 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.bath-simple-steps div {
  padding: 28px 28px 0 0;
  border-right: 1px solid var(--line);
  min-height: 210px;
}

.bath-simple-steps div+div {
  padding-left: 28px;
}

.bath-simple-steps div:last-child {
  border-right: 0;
}

.bath-simple-steps span {
  display: block;
  font-family: Georgia, serif;
  color: #8f9d86;
  letter-spacing: .24em;
  font-size: 13px;
  margin-bottom: 14px;
}

.bath-simple-steps strong {
  display: block;
  color: #173f35;
  font-size: 20px;
  line-height: 1.75;
  font-weight: 400;
  letter-spacing: .08em;
  margin-bottom: 12px;
}

.bath-simple-steps p {
  margin: 0;
  font-size: 14px;
  line-height: 2;
  color: #666158;
  max-width: none;
}

.bath-simple-note {
  max-width: none !important;
  margin-top: 30px !important;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  font-size: 13px !important;
  color: #7a746a !important;
}

/* v25: 朝風呂を「過ごす一日」に統合 */
.morning-bath-section {
  display: none !important;
}

.time-card.morning-hot h3 {
  color: #173f35;
}

.time-card.morning-hot .time-photo {
  background-image: url("../summer/assets/images/morning_large_bath.jpg") !important;
  background-position: center;
}

@media (max-width:980px) {
  .bath-editorial-simple {
    padding: 72px 24px 86px !important;
  }

  .bath-simple-inner {
    display: block;
    max-width: none;
  }

  .bath-simple-image {
    height: 330px;
    min-height: 0;
    margin: 0 0 36px;
  }

  .bath-simple-copy {
    padding: 0;
  }

  .bath-simple-copy .paper-kicker {
    font-size: 12px;
    letter-spacing: .25em;
    margin-bottom: 22px;
  }

  .bath-simple-copy h2 {
    font-size: 29px;
    line-height: 1.72;
    letter-spacing: .06em;
    margin-bottom: 26px;
    max-width: 10em;
  }

  .bath-simple-copy p {
    font-size: 15px;
    line-height: 2.02;
    max-width: none;
  }

  .bath-simple-steps {
    display: block;
    margin-top: 38px;
  }

  .bath-simple-steps div {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 24px 0 22px !important;
    min-height: 0;
  }

  .bath-simple-steps div:last-child {
    border-bottom: 0;
  }

  .bath-simple-steps strong {
    font-size: 20px;
    line-height: 1.65;
    max-width: none;
  }

  .bath-simple-steps p {
    font-size: 14px;
    line-height: 1.95;
  }

  .bath-simple-note {
    font-size: 12px !important;
    line-height: 1.9 !important;
  }
}

/* v26: 不感温浴セクションをPLANET JAPAN Aboutのような余白・大判写真・整然とした情報設計へ */
.bath-planet {
  background: #fbf8ef !important;
  padding: 118px 7vw 128px !important;
  position: relative !important;
  overflow: hidden !important;
}

.bath-planet:before,
.bath-planet:after,
.bath-planet .bath-editorial-hero-frame,
.bath-planet .bath-editorial-lower,
.bath-planet .bath-simple-inner {
  display: none !important;
}

.bath-planet::before {
  content: "BATHING" !important;
  display: block !important;
  position: absolute !important;
  top: 48px !important;
  right: -.06em !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 13vw !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
  color: rgba(143, 157, 134, .075) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.bath-planet-head {
  position: relative;
  z-index: 2;
  max-width: 1220px;
  margin: 0 auto 72px;
  display: grid;
  grid-template-columns: minmax(420px, .92fr) minmax(420px, .9fr);
  gap: clamp(70px, 8vw, 140px);
  align-items: start;
}

.bath-planet-title .paper-kicker {
  font-family: Georgia, "Times New Roman", serif;
  color: #8f9d86;
  letter-spacing: .34em;
  font-size: 13px;
  margin: 0 0 34px;
}

.bath-planet-title h2 {
  margin: 0;
  color: #173f35;
  font-size: clamp(46px, 4vw, 68px);
  line-height: 1.62;
  letter-spacing: .08em;
  font-weight: 400;
  word-break: keep-all;
  line-break: strict;
}

.bath-planet-lead {
  padding-top: 48px;
  max-width: 38em;
}

.bath-planet-lead p {
  margin: 0 0 26px;
  color: #4f4b44;
  font-size: 16px;
  line-height: 2.25;
  letter-spacing: .025em;
  word-break: keep-all;
  line-break: strict;
}

.bath-planet-visual {
  position: relative;
  z-index: 1;
  max-width: 1260px;
  margin: 0 auto;
  min-height: 540px;
}

.bath-planet-main {
  position: relative;
  width: 72%;
  height: 540px;
  margin: 0;
  overflow: hidden;
  background: #e4ddcf;
  box-shadow: 0 24px 60px rgba(45, 36, 26, .10);
}

.bath-planet-main img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.bath-planet-texture {
  position: absolute;
  right: 0;
  bottom: 24px;
  width: 41%;
  min-height: 320px;
  background: #efe9dc;
  border: 1px solid rgba(196, 190, 177, .75);
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 34px 40px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 92px;
  line-height: 1;
  color: rgba(143, 157, 134, .26);
  letter-spacing: .04em;
  box-shadow: 0 18px 46px rgba(45, 36, 26, .08);
}

.bath-planet-features {
  position: relative;
  z-index: 2;
  max-width: 1220px;
  margin: 72px auto 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.bath-planet-features article {
  padding: 40px 42px 42px 0;
  border-right: 1px solid var(--line);
}

.bath-planet-features article+article {
  padding-left: 42px;
}

.bath-planet-features article:last-child {
  border-right: 0;
}

.bath-planet-features span {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  color: #8f9d86;
  letter-spacing: .26em;
  font-size: 13px;
  margin-bottom: 18px;
}

.bath-planet-features h3 {
  margin: 0 0 18px;
  color: #173f35;
  font-size: 28px;
  line-height: 1.75;
  font-weight: 400;
  letter-spacing: .08em;
  word-break: keep-all;
  line-break: strict;
}

.bath-planet-features p {
  margin: 0;
  color: #5f5a51;
  font-size: 15px;
  line-height: 2.05;
  letter-spacing: .01em;
  word-break: keep-all;
  line-break: strict;
}

.bath-planet .bath-simple-note {
  position: relative;
  z-index: 2;
  max-width: 1220px !important;
  margin: 28px auto 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
  color: #7a746a !important;
  font-size: 13px !important;
  line-height: 2 !important;
}

@media (max-width:980px) {
  .bath-planet {
    padding: 72px 24px 82px !important;
  }

  .bath-planet::before {
    font-size: 22vw !important;
    top: 36px !important;
    right: -.3em !important;
  }

  .bath-planet-head {
    display: block;
    margin-bottom: 42px;
  }

  .bath-planet-title .paper-kicker {
    font-size: 12px;
    letter-spacing: .25em;
    margin-bottom: 22px;
  }

  .bath-planet-title h2 {
    font-size: 30px;
    line-height: 1.72;
    letter-spacing: .06em;
    max-width: 10em;
  }

  .bath-planet-lead {
    padding-top: 28px;
    max-width: none;
  }

  .bath-planet-lead p {
    font-size: 15px;
    line-height: 2.02;
    margin-bottom: 18px;
  }

  .bath-planet-visual {
    min-height: auto;
  }

  .bath-planet-main {
    width: 100%;
    height: 300px;
    box-shadow: 0 16px 34px rgba(45, 36, 26, .09);
  }

  .bath-planet-texture {
    position: relative;
    right: auto;
    bottom: auto;
    width: calc(100% - 40px);
    min-height: 120px;
    margin: -34px 0 0 auto;
    padding: 24px 24px;
    font-size: 54px;
  }

  .bath-planet-features {
    display: block;
    margin-top: 46px;
  }

  .bath-planet-features article,
  .bath-planet-features article+article {
    padding: 26px 0 28px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .bath-planet-features article:last-child {
    border-bottom: 0;
  }

  .bath-planet-features h3 {
    font-size: 23px;
    line-height: 1.7;
    max-width: none;
  }

  .bath-planet-features p {
    font-size: 14px;
    line-height: 1.95;
  }

  .bath-planet .bath-simple-note {
    font-size: 12px !important;
    line-height: 1.9 !important;
    margin-top: 22px !important;
  }
}

/* v27: 左の緑帯削除 / PLANET JAPAN about 参考の余白ある不感温浴 / 浮き上がり演出 */
/* 左側の不要な緑帯を消す */
.seasonal-note-inner::before,
.seasonal-note-inner::after {
  display: none !important;
  content: none !important;
}

.seasonal-main {
  left: 0 !important;
  width: 76vw !important;
}

@media (max-width:980px) {
  .seasonal-main {
    left: 0 !important;
    width: 100% !important;
  }
}

/* スクロール時に少し浮き上がる演出 */
.reveal-up,
.reveal-child {
  opacity: 0;
  transform: translateY(46px);
  transition: opacity .95s ease, transform 1.05s cubic-bezier(.19, 1, .22, 1);
  will-change: opacity, transform;
}

.reveal-up.is-visible,
.reveal-child.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {

  .reveal-up,
  .reveal-child {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* 不感温浴：大判写真、余白、静かな情報設計へ */
.bath-planet {
  background: #fbf8ef !important;
  padding: 0 0 128px !important;
  position: relative !important;
  overflow: hidden !important;
}

.bath-planet:before,
.bath-planet:after,
.bath-planet .bath-editorial-hero-frame,
.bath-planet .bath-editorial-lower,
.bath-planet .bath-simple-inner {
  display: none !important;
}

.bath-planet::before {
  content: "BATHING" !important;
  display: block !important;
  position: absolute !important;
  top: 44px !important;
  right: -.04em !important;
  z-index: 0 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 12vw !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
  color: rgba(143, 157, 134, .06) !important;
  pointer-events: none !important;
}

.bath-planet-visual {
  position: relative !important;
  z-index: 1 !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 0 0 !important;
  padding: 0 !important;
}

.bath-planet-main {
  width: 100% !important;
  height: clamp(520px, 56vw, 760px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
  background: #e4ddcf !important;
}

.bath-planet-main img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 48% !important;
  filter: saturate(.92) brightness(.88) !important;
}

.bath-planet-main::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .18));
  pointer-events: none;
}

.bath-planet-texture {
  position: absolute !important;
  left: 7vw !important;
  bottom: 52px !important;
  right: auto !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: block !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(72px, 11vw, 170px) !important;
  color: rgba(255, 255, 255, .72) !important;
  letter-spacing: .03em !important;
  line-height: 1 !important;
  text-shadow: 0 8px 34px rgba(0, 0, 0, .18) !important;
}

.bath-planet-head {
  position: relative !important;
  z-index: 3 !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 96px 7vw 0 !important;
  display: grid !important;
  grid-template-columns: minmax(360px, .78fr) minmax(420px, 1fr) !important;
  gap: clamp(72px, 9vw, 150px) !important;
  align-items: start !important;
}

.bath-planet-title .paper-kicker {
  font-family: Georgia, "Times New Roman", serif !important;
  color: #8f9d86 !important;
  letter-spacing: .34em !important;
  font-size: 13px !important;
  margin: 0 0 34px !important;
}

.bath-planet-title h2 {
  margin: 0 !important;
  color: #173f35 !important;
  font-size: clamp(42px, 3.65vw, 64px) !important;
  line-height: 1.7 !important;
  letter-spacing: .08em !important;
  font-weight: 400 !important;
  word-break: keep-all !important;
  line-break: strict !important;
  text-wrap: balance !important;
}

.bath-planet-lead {
  padding-top: 58px !important;
  max-width: 44em !important;
}

.bath-planet-lead p {
  margin: 0 0 28px !important;
  color: #4f4b44 !important;
  font-size: 16px !important;
  line-height: 2.25 !important;
  letter-spacing: .025em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  overflow-wrap: break-word !important;
}

.bath-planet-features {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1180px !important;
  margin: 76px auto 0 !important;
  padding: 0 7vw !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(34px, 5vw, 70px) !important;
  border: 0 !important;
}

.bath-planet-features article {
  padding: 30px 0 0 !important;
  border-top: 1px solid var(--line) !important;
  border-right: 0 !important;
}

.bath-planet-features article+article {
  padding-left: 0 !important;
}

.bath-planet-features span {
  display: block !important;
  font-family: Georgia, "Times New Roman", serif !important;
  color: #8f9d86 !important;
  letter-spacing: .26em !important;
  font-size: 13px !important;
  margin-bottom: 20px !important;
}

.bath-planet-features h3 {
  margin: 0 0 18px !important;
  color: #173f35 !important;
  font-size: 25px !important;
  line-height: 1.75 !important;
  font-weight: 400 !important;
  letter-spacing: .08em !important;
  word-break: keep-all !important;
  line-break: strict !important;
}

.bath-planet-features p {
  margin: 0 !important;
  color: #5f5a51 !important;
  font-size: 15px !important;
  line-height: 2.05 !important;
  letter-spacing: .01em !important;
  word-break: keep-all !important;
  line-break: strict !important;
  overflow-wrap: break-word !important;
}

.bath-planet .bath-simple-note {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1180px !important;
  margin: 36px auto 0 !important;
  padding: 22px 7vw 0 !important;
  border-top: 1px solid var(--line) !important;
  color: #7a746a !important;
  font-size: 13px !important;
  line-height: 2 !important;
}

@media (max-width:980px) {
  .bath-planet {
    padding-bottom: 82px !important;
  }

  .bath-planet::before {
    font-size: 24vw !important;
    top: 36px !important;
    right: -.42em !important;
  }

  .bath-planet-main {
    height: 360px !important;
  }

  .bath-planet-texture {
    left: 24px !important;
    bottom: 24px !important;
    font-size: 64px !important;
  }

  .bath-planet-head {
    display: block !important;
    padding: 58px 24px 0 !important;
  }

  .bath-planet-title .paper-kicker {
    font-size: 12px !important;
    letter-spacing: .24em !important;
    margin-bottom: 20px !important;
  }

  .bath-planet-title h2 {
    font-size: 29px !important;
    line-height: 1.72 !important;
    letter-spacing: .06em !important;
    max-width: 10em !important;
  }

  .bath-planet-lead {
    padding-top: 30px !important;
    max-width: none !important;
  }

  .bath-planet-lead p {
    font-size: 15px !important;
    line-height: 2.02 !important;
    margin-bottom: 18px !important;
  }

  .bath-planet-features {
    display: block !important;
    margin-top: 48px !important;
    padding: 0 24px !important;
  }

  .bath-planet-features article,
  .bath-planet-features article+article {
    padding: 28px 0 28px !important;
    border-top: 1px solid var(--line) !important;
    border-bottom: 0 !important;
  }

  .bath-planet-features h3 {
    font-size: 22px !important;
    line-height: 1.68 !important;
    max-width: none !important;
  }

  .bath-planet-features p {
    font-size: 14px !important;
    line-height: 1.95 !important;
  }

  .bath-planet .bath-simple-note {
    margin-top: 12px !important;
    padding: 20px 24px 0 !important;
    font-size: 12px !important;
    line-height: 1.9 !important;
  }
}


/* v28 不感温浴：写真帯＋文字載せ、下部は余白のあるダークレイアウト */
.bath-planet-refined {
  background: #fbf8ef !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.bath-planet-refined:before,
.bath-planet-refined:after,
.bath-planet-refined .bath-planet-head,
.bath-planet-refined .bath-planet-visual,
.bath-planet-refined .bath-planet-features {
  display: none !important;
}

.bath-band {
  position: relative !important;
  min-height: clamp(580px, 68vw, 860px) !important;
  width: 100% !important;
  overflow: hidden !important;
  background: #111 !important;
}

.bath-band-image {
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
}

.bath-band-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 48% !important;
  filter: saturate(.9) brightness(.78) !important;
  transform: scale(1.02) !important;
}

.bath-band:after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .56) 0%, rgba(0, 0, 0, .30) 42%, rgba(0, 0, 0, .10) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .08) 45%, rgba(0, 0, 0, .42) 100%) !important;
  pointer-events: none !important;
}

.bath-band-copy {
  position: absolute !important;
  z-index: 3 !important;
  left: 7vw !important;
  bottom: clamp(62px, 9vw, 130px) !important;
  width: min(620px, 44vw) !important;
  color: #fff !important;
}

.bath-band-kicker {
  font-family: Georgia, "Times New Roman", serif !important;
  color: rgba(255, 255, 255, .78) !important;
  letter-spacing: .28em !important;
  font-size: 13px !important;
  margin-bottom: 24px !important;
}

.bath-band-copy h2 {
  margin: 0 0 24px !important;
  color: #fff !important;
  font-size: clamp(44px, 5.2vw, 82px) !important;
  line-height: 1.42 !important;
  letter-spacing: .08em !important;
  font-weight: 400 !important;
  text-shadow: 0 8px 28px rgba(0, 0, 0, .28) !important;
  word-break: keep-all !important;
  line-break: strict !important;
}

.bath-band-copy p {
  margin: 0 !important;
  color: rgba(255, 255, 255, .9) !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
  letter-spacing: .04em !important;
  max-width: 36em !important;
  text-shadow: 0 6px 20px rgba(0, 0, 0, .26) !important;
}

.bath-dark-scene {
  background: #101111 !important;
  color: #fff !important;
  padding: 110px 0 120px !important;
  position: relative !important;
}

.bath-dark-content {
  width: min(1180px, 86vw) !important;
  margin: 0 auto !important;
  min-height: 720px !important;
  position: relative !important;
}

.bath-dark-copy {
  width: min(410px, 36vw) !important;
  padding-top: 40px !important;
  position: relative !important;
  z-index: 4 !important;
}

.bath-dark-copy span {
  display: block !important;
  color: rgba(255, 255, 255, .58) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
  margin-bottom: 26px !important;
}

.bath-dark-copy h3 {
  color: #fff !important;
  font-size: clamp(30px, 3vw, 44px) !important;
  line-height: 1.62 !important;
  letter-spacing: .08em !important;
  font-weight: 400 !important;
  margin: 0 0 38px !important;
  word-break: keep-all !important;
  line-break: strict !important;
}

.bath-dark-copy p {
  color: rgba(255, 255, 255, .82) !important;
  font-size: 16px !important;
  line-height: 2.35 !important;
  letter-spacing: .035em !important;
  margin: 0 !important;
}

.bath-dark-main {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: min(50vw, 760px) !important;
  height: 410px !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.bath-dark-main img,
.bath-dark-sub img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.bath-dark-main img {
  object-position: center !important;
  filter: saturate(.85) brightness(.82) !important;
}

.bath-dark-sub {
  position: absolute !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.bath-dark-sub-01 {
  left: -6vw !important;
  bottom: 0 !important;
  width: 330px !important;
  height: 260px !important;
}

.bath-dark-sub-02 {
  right: 15vw !important;
  bottom: 18px !important;
  width: 520px !important;
  height: 280px !important;
}

.bath-dark-sub img {
  filter: saturate(.88) brightness(.86) !important;
}

.bath-dark-steps {
  width: min(1180px, 86vw) !important;
  margin: 74px auto 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1px !important;
  background: rgba(255, 255, 255, .16) !important;
}

.bath-dark-steps article {
  background: #101111 !important;
  padding: 34px 36px 32px !important;
  min-height: 220px !important;
}

.bath-dark-steps span {
  display: block !important;
  font-family: Georgia, "Times New Roman", serif !important;
  color: rgba(255, 255, 255, .5) !important;
  letter-spacing: .25em !important;
  font-size: 13px !important;
  margin-bottom: 16px !important;
}

.bath-dark-steps h4 {
  color: #fff !important;
  font-size: 22px !important;
  line-height: 1.6 !important;
  letter-spacing: .08em !important;
  font-weight: 400 !important;
  margin: 0 0 12px !important;
}

.bath-dark-steps p {
  color: rgba(255, 255, 255, .76) !important;
  font-size: 14px !important;
  line-height: 2 !important;
  margin: 0 !important;
}

.bath-planet-refined .bath-simple-note {
  width: min(1180px, 86vw) !important;
  margin: 34px auto 0 !important;
  padding-top: 20px !important;
  border-top: 1px solid rgba(255, 255, 255, .16) !important;
  color: rgba(255, 255, 255, .58) !important;
  font-size: 12px !important;
  line-height: 1.9 !important;
}

@media (max-width:980px) {
  .bath-band {
    min-height: 540px !important;
  }

  .bath-band-copy {
    left: 24px !important;
    right: 24px !important;
    bottom: 44px !important;
    width: auto !important;
  }

  .bath-band-kicker {
    font-size: 12px !important;
    letter-spacing: .22em !important;
    margin-bottom: 18px !important;
  }

  .bath-band-copy h2 {
    font-size: 34px !important;
    line-height: 1.55 !important;
    margin-bottom: 18px !important;
  }

  .bath-band-copy p {
    font-size: 14px !important;
    line-height: 1.95 !important;
    letter-spacing: .02em !important;
  }

  .bath-dark-scene {
    padding: 68px 0 76px !important;
  }

  .bath-dark-content {
    width: 100% !important;
    min-height: auto !important;
    padding: 0 24px !important;
  }

  .bath-dark-copy {
    width: auto !important;
    padding-top: 0 !important;
    margin: 0 0 32px !important;
  }

  .bath-dark-copy span {
    font-size: 15px !important;
    margin-bottom: 18px !important;
  }

  .bath-dark-copy h3 {
    font-size: 28px !important;
    line-height: 1.7 !important;
    margin-bottom: 20px !important;
  }

  .bath-dark-copy p {
    font-size: 14px !important;
    line-height: 2.05 !important;
  }

  .bath-dark-main {
    position: relative !important;
    width: 100% !important;
    height: 260px !important;
    right: auto !important;
    top: auto !important;
    margin: 0 0 14px !important;
  }

  .bath-dark-sub-01,
  .bath-dark-sub-02 {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: 190px !important;
    margin: 14px 0 0 !important;
  }

  .bath-dark-steps {
    width: auto !important;
    margin: 38px 24px 0 !important;
    grid-template-columns: 1fr !important;
    background: rgba(255, 255, 255, .14) !important;
  }

  .bath-dark-steps article {
    padding: 26px 22px 24px !important;
    min-height: 0 !important;
  }

  .bath-dark-steps h4 {
    font-size: 21px !important;
  }

  .bath-dark-steps p {
    font-size: 13px !important;
    line-height: 1.9 !important;
  }

  .bath-planet-refined .bath-simple-note {
    width: auto !important;
    margin: 26px 24px 0 !important;
    font-size: 12px !important;
  }
}

/* v31 finishing pass: keep the page close to the official Fukiya hierarchy. */
/*html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
  background: #f5f0e6;
}

body {
  font-size: 16px;
  letter-spacing: .045em;
  line-height: 2.05;
}

video {
  max-width: 100%;
}

p,
li,
.mini-note,
.time-body,
.bath-dark-steps article {
  overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
.timeline h2 span {
  word-break: keep-all;
  overflow-wrap: break-word;
  line-break: strict;
}*/

.site-header {
  height: 172px !important;
  padding: 22px 7vw 0 8vw !important;
  grid-template-columns: 230px minmax(0, 1fr) 178px !important;
  gap: 28px !important;
}

.logo-mark {
  width: 205px !important;
  height: 174px !important;
}

.header-nav {
  font-size: 14px !important;
  letter-spacing: .05em !important;
}

.header-nav a {
  padding: 0 10px !important;
}

.hero {
  min-height: 700px !important;
  padding: 0 8vw 96px !important;
}

.hero-title .en {
  font-size: clamp(48px, 5.6vw, 72px) !important;
  letter-spacing: .11em !important;
}

.hero-title h1 {
  font-size: clamp(38px, 3.6vw, 46px) !important;
  letter-spacing: .22em !important;
}

.hero-title p {
  font-size: 17px !important;
  line-height: 2.05 !important;
  max-width: 620px !important;
}

.reserve-inner {
  grid-template-columns: minmax(260px, 340px) minmax(150px, 220px) 110px 82px 100px 130px 120px 128px 128px !important;
}

.reserve-catch {
  font-size: 16px !important;
}

.intro h2,
.seasonal-copy h2,
.dynamic-section .text h3,
.bridge-text h2,
.timeline h2,
.furin-copy h2,
.bath-band-copy h2,
.bath-dark-copy h3 {
  font-weight: 400 !important;
}

.intro h2 {
  font-size: clamp(34px, 3.1vw, 44px) !important;
  line-height: 1.72 !important;
  letter-spacing: .08em !important;
}

.intro-line {
  display: block;
}

.intro-line-sp {
  display: none;
}

.intro p {
  font-size: 16px !important;
  line-height: 2.15 !important;
  letter-spacing: .035em !important;
}

/* Remove the old vertical green band and restore this section as a calm bridge. */
.seasonal-note {
  background: #f5f0e6 !important;
  padding: 86px 6vw 42px !important;
}

.seasonal-note-inner {
  width: min(1180px, 100%) !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .72fr) !important;
  gap: 34px 44px !important;
  overflow: visible !important;
  background: transparent !important;
}

.seasonal-note-inner::before,
.seasonal-note-inner::after {
  display: none !important;
  content: none !important;
}

.seasonal-main,
.seasonal-sub,
.seasonal-copy {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  z-index: auto !important;
}

.seasonal-main {
  min-height: 440px !important;
  grid-row: 1/3 !important;
}

.seasonal-main img,
.seasonal-sub img {
  min-height: inherit !important;
}

.seasonal-sub {
  min-height: 260px !important;
  align-self: end !important;
  box-shadow: 0 18px 38px rgba(39, 34, 27, .09) !important;
}

.seasonal-copy {
  display: block !important;
  min-height: 0 !important;
  padding: 42px 44px !important;
  background: #fbf8ef !important;
  box-shadow: 0 14px 34px rgba(39, 34, 27, .06) !important;
}

.seasonal-copy h2 {
  font-size: 30px !important;
  line-height: 1.75 !important;
  letter-spacing: .09em !important;
  color: #234a41 !important;
}

.seasonal-copy h2 .jp {
  font-size: 15px !important;
  line-height: 2.1 !important;
  letter-spacing: .04em !important;
  max-width: none !important;
}

.dynamic-section {
  min-height: 660px !important;
  margin-bottom: 88px !important;
}

.dynamic-section .visual {
  min-height: 620px !important;
}

.dynamic-section .text,
.dynamic-section.reverse .text {
  padding: 54px 50px 50px !important;
  margin-top: 22px !important;
}

.dynamic-section .num {
  font-size: 52px !important;
}

.dynamic-section .text h3 {
  font-size: 30px !important;
  line-height: 1.72 !important;
  letter-spacing: .08em !important;
}

.dynamic-section .text p,
.dynamic-section .mini-note {
  font-size: 15px !important;
  line-height: 2.08 !important;
  letter-spacing: .035em !important;
}

.bath-planet-refined {
  background: #f5f0e6 !important;
}

.bath-band {
  min-height: clamp(520px, 56vw, 720px) !important;
  background: #1f211f !important;
}

.bath-band-image img {
  filter: saturate(.94) brightness(.86) !important;
  transform: none !important;
}

.bath-band:after {
  background:
    linear-gradient(90deg, rgba(22, 25, 22, .48) 0%, rgba(22, 25, 22, .25) 46%, rgba(22, 25, 22, .06) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, .04) 0%, rgba(0, 0, 0, .10) 56%, rgba(0, 0, 0, .34) 100%) !important;
}

.bath-band-copy {
  width: min(560px, 48vw) !important;
  bottom: clamp(56px, 7vw, 92px) !important;
}

.bath-band-copy h2 {
  font-size: clamp(36px, 3.4vw, 48px) !important;
  line-height: 1.58 !important;
  letter-spacing: .07em !important;
}

.bath-band-copy p {
  font-size: 15px !important;
  line-height: 2.05 !important;
}

.bath-dark-scene {
  background: #151716 !important;
  padding: 96px 0 106px !important;
}

.bath-dark-content {
  min-height: 640px !important;
}

.bath-dark-copy {
  width: min(430px, 38vw) !important;
}

.bath-dark-copy h3 {
  font-size: clamp(28px, 2.45vw, 36px) !important;
  line-height: 1.72 !important;
}

.bath-dark-copy p {
  font-size: 15px !important;
  line-height: 2.22 !important;
}

.bath-dark-main {
  height: 380px !important;
}

.bath-dark-sub-01 {
  width: 300px !important;
  height: 230px !important;
}

.bath-dark-sub-02 {
  width: 460px !important;
  height: 250px !important;
}

.bath-dark-steps {
  margin-top: 58px !important;
  background: transparent !important;
  border-top: 1px solid rgba(255, 255, 255, .18) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .18) !important;
}

.bath-dark-steps article {
  min-height: 0 !important;
  padding: 28px 30px 30px !important;
  border-right: 1px solid rgba(255, 255, 255, .14) !important;
  background: transparent !important;
}

.bath-dark-steps article:last-child {
  border-right: 0 !important;
}

.bath-dark-steps h4 {
  font-size: 19px !important;
}

.bath-dark-steps p {
  font-size: 13px !important;
  line-height: 1.95 !important;
}

.bridge {
  margin-top: 88px !important;
  background: #2d2a24 !important;
}

.bridge-text h2 {
  font-size: 30px !important;
  color: #fff !important;
}

.bridge-text p {
  font-size: 15px !important;
  line-height: 2.15 !important;
  color: rgba(255, 255, 255, .82) !important;
}

.bridge-list div {
  font-size: 18px !important;
}

.furin-section {
  padding: 104px 7vw 116px !important;
  background: #fbf8ef !important;
}

.furin-section:before {
  color: rgba(143, 157, 134, .06) !important;
}

.furin-inner {
  grid-template-columns: minmax(0, .96fr) minmax(280px, .72fr) !important;
  gap: clamp(44px, 6vw, 86px) !important;
}

.furin-copy h2 {
  font-size: 32px !important;
  line-height: 1.78 !important;
  letter-spacing: .08em !important;
  max-width: 14em !important;
}

.furin-copy p {
  font-size: 15px !important;
  line-height: 2.08 !important;
  letter-spacing: .035em !important;
  max-width: 38em !important;
}

.furin-lead {
  color: #3f5145 !important;
}

.furin-media {
  max-width: 360px !important;
  justify-self: end !important;
}

.furin-video {
  aspect-ratio: 4/5 !important;
}

.timeline {
  padding: 88px 8vw 132px !important;
}

.timeline h2 {
  display: flex !important;
  gap: .2em !important;
  flex-wrap: wrap !important;
  font-size: 34px !important;
  line-height: 1.55 !important;
  letter-spacing: .10em !important;
}

.time-card {
  grid-template-columns: minmax(0, 1fr) 220px !important;
  gap: 30px !important;
}

.time-card h3 {
  font-size: 22px !important;
  line-height: 1.68 !important;
  letter-spacing: .07em !important;
}

.time-card p {
  font-size: 14px !important;
  line-height: 2 !important;
  letter-spacing: .03em !important;
}

.prefooter-box p,
.prefooter-box .best {
  font-size: 19px !important;
}

.cta-btn,
.line-btn {
  font-size: 18px !important;
}

.site-footer {
  grid-template-columns: 260px minmax(220px, 1fr) minmax(360px, 520px) !important;
  gap: 56px !important;
  padding: 96px 8vw 78px !important;
}

.footer-info {
  font-size: 16px !important;
}

.footer-menu {
  font-size: 17px !important;
}

@media (max-width:1100px) {
  .site-header {
    height: 82px !important;
    padding: 12px 20px !important;
    display: flex !important;
  }

  .logo-mark {
    width: 116px !important;
    height: 68px !important;
  }
}

@media (max-width:980px) {
  /*body {
    letter-spacing: .035em;
  }
*/
  .hero {
    min-height: 620px !important;
    padding: 116px 24px 68px !important;
  }

  .hero-title .en {
    font-size: 40px !important;
  }

  .hero-title h1 {
    font-size: 34px !important;
    letter-spacing: .16em !important;
  }

  .hero-title p {
    font-size: 15px !important;
    line-height: 2 !important;
  }

  .reserve-inner {
    grid-template-columns: 1fr 1fr !important;
  }

  .intro {
    padding: 72px 24px 56px !important;
  }

  .intro h2 {
    font-size: 26px !important;
    line-height: 1.72 !important;
    letter-spacing: .045em !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
  }

  .intro-line-pc {
    display: none;
  }

  .intro-line-sp {
    display: block;
    white-space: nowrap;
  }

  .intro p {
    font-size: 15px !important;
    line-height: 2.02 !important;
  }

  .intro:after,
  .timeline:before,
  .prefooter:after {
    opacity: .45 !important;
  }

  .seasonal-note {
    padding: 54px 24px 24px !important;
  }

  .seasonal-note-inner {
    display: block !important;
  }

  .seasonal-main {
    min-height: 280px !important;
  }

  .seasonal-sub {
    width: 78% !important;
    min-height: 190px !important;
    margin: -28px 0 0 auto !important;
  }

  .seasonal-copy {
    margin: -18px 18px 0 0 !important;
    padding: 34px 24px !important;
  }

  .seasonal-copy h2 {
    font-size: 24px !important;
    line-height: 1.7 !important;
    letter-spacing: .055em !important;
  }

  .seasonal-copy h2 .jp {
    font-size: 14px !important;
    line-height: 2 !important;
  }

  .dynamic-section .visual,
  .dynamic-section.reverse .visual {
    min-height: 280px !important;
  }

  .dynamic-section .text,
  .dynamic-section.reverse .text {
    margin: -22px 20px 0 !important;
    padding: 34px 22px 32px !important;
  }

  .dynamic-section .num {
    font-size: 42px !important;
  }

  .dynamic-section .text h3 {
    font-size: 24px !important;
    line-height: 1.68 !important;
    letter-spacing: .055em !important;
  }

  .dynamic-section .text p,
  .dynamic-section .mini-note {
    font-size: 14px !important;
    line-height: 1.95 !important;
  }

  .bath-band {
    min-height: 500px !important;
  }

  .bath-band-copy {
    left: 22px !important;
    right: 22px !important;
    bottom: 38px !important;
  }

  .bath-band-copy h2 {
    font-size: 28px !important;
    line-height: 1.62 !important;
    letter-spacing: .05em !important;
  }

  .bath-band-copy p {
    font-size: 14px !important;
    line-height: 1.95 !important;
  }

  .bath-band-image img {
    transform: none !important;
  }

  .bath-dark-scene {
    padding: 60px 0 68px !important;
  }

  .bath-dark-content {
    padding: 0 22px !important;
  }

  .bath-dark-copy h3 {
    font-size: 25px !important;
    line-height: 1.68 !important;
    letter-spacing: .055em !important;
  }

  .bath-dark-copy p {
    font-size: 14px !important;
    line-height: 2 !important;
  }

  .bath-dark-main {
    height: 240px !important;
  }

  .bath-dark-sub-01,
  .bath-dark-sub-02 {
    width: 100% !important;
    height: 170px !important;
  }

  .bath-dark-steps {
    margin: 34px 22px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, .16) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .16) !important;
  }

  .bath-dark-steps article {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .14) !important;
    padding: 24px 0 !important;
  }

  .bath-dark-steps article:last-child {
    border-bottom: 0 !important;
  }

  .bridge {
    margin: 34px 0 72px !important;
  }

  .bridge-text h2 {
    font-size: 24px !important;
    line-height: 1.72 !important;
    letter-spacing: .055em !important;
  }

  .bridge-text p {
    font-size: 14px !important;
    line-height: 2 !important;
  }

  .furin-section {
    padding: 62px 24px 70px !important;
  }

  .furin-copy h2 {
    font-size: 24px !important;
    line-height: 1.68 !important;
    letter-spacing: .055em !important;
    max-width: 13em !important;
  }

  .furin-copy p {
    font-size: 14px !important;
    line-height: 1.95 !important;
  }

  .furin-media {
    max-width: 300px !important;
    margin: 26px 0 0 auto !important;
  }

  .furin-video {
    aspect-ratio: 4/5 !important;
  }

  .timeline {
    padding: 64px 22px 88px !important;
  }

  .timeline h2 {
    display: block !important;
    font-size: 26px !important;
    line-height: 1.62 !important;
    letter-spacing: .055em !important;
    margin-bottom: 44px !important;
  }

  .timeline h2 span {
    display: inline-block !important;
  }

  .time-grid:before {
    left: 58px !important;
  }

  .time-card {
    display: block !important;
    padding: 0 0 34px 92px !important;
  }

  .time-card:before {
    left: 48px !important;
  }

  .time {
    width: 42px !important;
    font-size: 13px !important;
    letter-spacing: .06em !important;
  }

  .time-card h3 {
    font-size: 20px !important;
    line-height: 1.62 !important;
    letter-spacing: .05em !important;
  }

  .time-card p {
    font-size: 14px !important;
    line-height: 1.92 !important;
  }

  .time-photo {
    height: 158px !important;
    margin-top: 16px !important;
  }

  .prefooter-box {
    width: 100% !important;
  }

  .cta-btn,
  .line-btn {
    max-width: 360px !important;
  }

  .site-footer {
    grid-template-columns: 1fr !important;
    padding: 70px 26px 78px !important;
    gap: 30px !important;
  }
}

@media (max-width:560px) {
  .tool {
    width: 54px !important;
  }

  .hero {
    min-height: 590px !important;
  }

  .intro h2,
  .seasonal-copy h2,
  .dynamic-section .text h3,
  .bath-band-copy h2,
  .bath-dark-copy h3,
  .bridge-text h2,
  .furin-copy h2,
  .timeline h2 {
    overflow-wrap: anywhere;
  }

  .intro h2 {
    overflow-wrap: normal !important;
  }

  .seasonal-sub {
    width: 84% !important;
  }

  .time-grid:before {
    left: 48px !important;
  }

  .time-card {
    padding-left: 78px !important;
  }

  .time-card:before {
    left: 38px !important;
  }

  .time {
    width: 34px !important;
    font-size: 12px !important;
  }
}

/* v32 reference pass: Fukiya restraint + immersive landscape rhythm. */
:root {
  --v32-ink: #26231d;
  --v32-muted: #6b665b;
  --v32-paper: #f4efe4;
  --v32-paper-soft: #fbf8f0;
  --v32-green: #193f35;
  --v32-deep: #141715;
  --v32-line: rgba(88, 78, 62, .18);
}

/*body {
  background: var(--v32-paper) !important;
  color: var(--v32-ink) !important;
  letter-spacing: .04em !important;
}*/

.hero {
  min-height: 760px !important;
  padding: 0 7.5vw 104px !important;
  background:
    linear-gradient(90deg, rgba(12, 18, 16, .62), rgba(12, 18, 16, .22) 44%, rgba(12, 18, 16, .34)),
    linear-gradient(180deg, rgba(9, 14, 13, .08), rgba(9, 14, 13, .38)),
    url("../summer/assets/images/embedded_002.jpg") center/cover no-repeat !important;
}

.hero:before {
  opacity: .18 !important;
}

.hero-inner {
  grid-template-columns: minmax(360px, 680px) minmax(90px, 1fr) !important;
  align-items: end !important;
}

.hero-title .en {
  color: rgba(234, 236, 216, .86) !important;
  font-size: clamp(44px, 5vw, 66px) !important;
  letter-spacing: .16em !important;
  margin-bottom: 34px !important;
}

.hero-title h1 {
  font-size: clamp(36px, 3.2vw, 44px) !important;
  letter-spacing: .26em !important;
  margin-bottom: 26px !important;
}

.hero-title p {
  font-size: 16px !important;
  line-height: 2.15 !important;
  letter-spacing: .08em !important;
}

.hero-period {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: 26px;
  padding: 10px 18px 10px 0;
  border-top: 1px solid rgba(234, 236, 216, .42);
  border-bottom: 1px solid rgba(234, 236, 216, .28);
  color: rgba(255, 255, 255, .92);
  font-family: Georgia, "Times New Roman", "Yu Mincho", "YuMincho", serif;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: .16em;
  text-shadow: 0 5px 18px rgba(0, 0, 0, .34);
}

.hero-period span {
  color: rgba(203, 212, 189, .92);
  font-size: 12px;
  letter-spacing: .22em;
}

.hero-vertical {
  justify-self: end;
  align-self: center;
  writing-mode: vertical-rl;
  margin: 0 2vw 16vh 0;
  color: rgba(255, 255, 255, .86);
  font-size: 18px;
  line-height: 2.2;
  letter-spacing: .22em;
  text-shadow: 0 5px 18px rgba(0, 0, 0, .34);
}

.intro {
  padding: 118px 7vw 96px !important;
  background: var(--v32-paper-soft) !important;
}

.intro:after {
  color: rgba(25, 63, 53, .045) !important;
  top: 20px !important;
}

.intro-grid {
  width: min(1120px, 100%) !important;
  margin: 0 auto !important;
  grid-template-columns: minmax(460px, .95fr) minmax(340px, 430px) !important;
}

.intro .kicker,
.bath-band-kicker,
.furin-kicker {
  color: #7d8b75 !important;
}

.intro h2 {
  font-size: clamp(34px, 3vw, 42px) !important;
  letter-spacing: .10em !important;
}

.intro p {
  padding-top: 18px !important;
  color: var(--v32-muted) !important;
}

.seasonal-note {
  padding: 0 !important;
  background: var(--v32-paper) !important;
}

.seasonal-note-inner {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 34vw) !important;
  gap: 0 !important;
  align-items: stretch !important;
  background: var(--v32-paper) !important;
}

.seasonal-main {
  min-height: 620px !important;
  grid-row: 1/3 !important;
  overflow: hidden !important;
}

.seasonal-main img {
  filter: saturate(.92) brightness(.94) !important;
}

.seasonal-sub {
  min-height: 300px !important;
  width: auto !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-left: 1px solid rgba(255, 255, 255, .34) !important;
}

.seasonal-copy {
  position: relative !important;
  margin: 0 !important;
  padding: 76px 5.5vw 76px 64px !important;
  background: var(--v32-green) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.seasonal-copy:before {
  content: "SUMMER COOLNESS";
  position: absolute;
  right: 34px;
  bottom: 26px;
  color: rgba(255, 255, 255, .06);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 44px;
  line-height: 1;
  letter-spacing: .12em;
  writing-mode: vertical-rl;
  pointer-events: none;
}

.seasonal-vertical {
  writing-mode: vertical-rl;
  color: rgba(255, 255, 255, .62);
  font-size: 13px;
  letter-spacing: .22em;
  line-height: 2;
  margin: 0 0 28px auto;
}

.seasonal-copy h2 {
  color: #fff !important;
  font-size: 28px !important;
  line-height: 1.85 !important;
}

.seasonal-copy h2 .jp {
  color: rgba(255, 255, 255, .78) !important;
  font-size: 14px !important;
  line-height: 2.15 !important;
}

.big-layout {
  padding: 128px 0 42px !important;
  background: var(--v32-paper) !important;
}

.dynamic-section,
.dynamic-section.reverse {
  min-height: 620px !important;
  margin: 0 0 104px !important;
  grid-template-columns: 8vw minmax(340px, 520px) minmax(420px, 1fr) 8vw !important;
  background: transparent !important;
}

.dynamic-section.reverse {
  grid-template-columns: 8vw minmax(420px, 1fr) minmax(340px, 520px) 8vw !important;
}

.dynamic-section .visual,
.dynamic-section.reverse .visual {
  min-height: 570px !important;
  box-shadow: none !important;
}

.dynamic-section .visual:after {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 44%, rgba(0, 0, 0, .28)) !important;
}

.dynamic-section .text,
.dynamic-section.reverse .text {
  padding: 54px 56px 52px !important;
  background: rgba(251, 248, 240, .92) !important;
  border: 1px solid rgba(83, 74, 59, .12) !important;
  box-shadow: none !important;
}

.dynamic-section.reverse .text {
  margin-left: -86px !important;
}

.dynamic-section .num {
  font-size: 34px !important;
  color: #7d8b75 !important;
  letter-spacing: .18em !important;
}

.dynamic-section .text h3 {
  font-size: 27px !important;
  line-height: 1.82 !important;
  color: var(--v32-green) !important;
}

.dynamic-section .text p,
.dynamic-section .mini-note {
  font-size: 14px !important;
  line-height: 2.15 !important;
  color: var(--v32-muted) !important;
}

.bath-planet-refined {
  background: var(--v32-paper) !important;
}

.bath-band {
  min-height: min(760px, 72vh) !important;
  background: #101312 !important;
}

.bath-band-image img {
  object-position: center 46% !important;
  filter: saturate(.9) brightness(.62) contrast(1.04) !important;
}

.bath-band:after {
  background:
    linear-gradient(90deg, rgba(8, 13, 12, .28), rgba(8, 13, 12, .08) 42%, rgba(8, 13, 12, .46)),
    linear-gradient(180deg, rgba(8, 13, 12, .08), rgba(8, 13, 12, .44)) !important;
}

.bath-band-copy {
  left: auto !important;
  right: 7vw !important;
  top: 50% !important;
  bottom: auto !important;
  width: min(520px, 42vw) !important;
  transform: translateY(-50%) !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  column-gap: 34px !important;
  align-items: center !important;
}

.bath-band-kicker {
  grid-column: 1/3 !important;
  color: rgba(255, 255, 255, .72) !important;
  margin: 0 0 28px auto !important;
}

.bath-band-copy h2 {
  writing-mode: vertical-rl;
  justify-self: end;
  margin: 0 !important;
  color: #fff !important;
  font-size: 34px !important;
  line-height: 1.85 !important;
  letter-spacing: .14em !important;
}

.bath-band-copy p {
  align-self: end;
  max-width: 310px !important;
  color: rgba(255, 255, 255, .86) !important;
  font-size: 14px !important;
  line-height: 2.15 !important;
}

.bath-dark-scene {
  background: var(--v32-deep) !important;
  padding: 124px 0 128px !important;
}

.bath-dark-scene:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 78% 18%, rgba(125, 139, 117, .09), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, .02), transparent 32%);
  pointer-events: none;
}

.bath-dark-content {
  width: min(1200px, 88vw) !important;
  min-height: 690px !important;
}

.bath-dark-copy {
  width: min(430px, 34vw) !important;
  padding-top: 78px !important;
}

.bath-dark-copy span {
  color: rgba(255, 255, 255, .46) !important;
  letter-spacing: .22em !important;
}

.bath-dark-copy h3 {
  font-size: 32px !important;
  line-height: 1.78 !important;
}

.bath-dark-copy p {
  color: rgba(255, 255, 255, .74) !important;
  font-size: 14px !important;
  line-height: 2.25 !important;
}

.bath-dark-main {
  top: 0 !important;
  right: 0 !important;
  width: min(56vw, 760px) !important;
  height: 460px !important;
}

.bath-dark-main img {
  filter: saturate(.86) brightness(.86) !important;
}

.bath-dark-sub-01 {
  left: 5vw !important;
  bottom: 0 !important;
  width: 280px !important;
  height: 210px !important;
}

.bath-dark-sub-02 {
  right: 7vw !important;
  bottom: 36px !important;
  width: 440px !important;
  height: 250px !important;
}

.bath-dark-steps {
  width: min(1200px, 88vw) !important;
  margin-top: 70px !important;
}

.bath-dark-steps article {
  padding: 30px 38px 32px !important;
}

.bath-dark-steps h4 {
  font-size: 18px !important;
  letter-spacing: .10em !important;
}

.bridge {
  margin: 0 !important;
  min-height: 610px !important;
  background: #26231f !important;
}

.bridge-text {
  padding: 106px 7vw !important;
}

.bridge-photo {
  min-height: 610px !important;
}

.bridge-list {
  background: rgba(20, 23, 21, .84) !important;
}

.furin-section {
  padding: 132px 7vw 138px !important;
  background:
    linear-gradient(90deg, rgba(25, 63, 53, .96) 0%, rgba(25, 63, 53, .92) 48%, rgba(244, 239, 228, .98) 48%, rgba(244, 239, 228, .98) 100%) !important;
}

.furin-section:before {
  content: "SOUND OF WIND" !important;
  color: rgba(255, 255, 255, .055) !important;
  left: 2vw !important;
  top: 72px !important;
  right: auto !important;
}

.furin-inner {
  width: min(1120px, 100%) !important;
  grid-template-columns: minmax(0, 420px) minmax(360px, 1fr) !important;
  gap: clamp(48px, 7vw, 96px) !important;
}

.furin-copy {
  color: #fff !important;
  max-width: 420px !important;
}

.furin-kicker {
  color: rgba(255, 255, 255, .58) !important;
}

.furin-copy h2 {
  color: #fff !important;
  font-size: 29px !important;
  line-height: 1.86 !important;
  max-width: 15em !important;
}

.furin-copy p {
  color: rgba(255, 255, 255, .76) !important;
  font-size: 14px !important;
  line-height: 2.15 !important;
  max-width: 31em !important;
}

.furin-copy .furin-lead {
  color: rgba(255, 255, 255, .92) !important;
}

.furin-media {
  position: relative;
  justify-self: center !important;
  max-width: 300px !important;
  padding: 0 0 48px 48px;
}

.furin-video {
  aspect-ratio: 9/14 !important;
  box-shadow: 0 24px 52px rgba(28, 24, 18, .18) !important;
}

.furin-sound-mark {
  position: absolute;
  right: -54px;
  top: 34px;
  writing-mode: vertical-rl;
  color: var(--v32-green);
  font-size: 16px;
  letter-spacing: .24em;
  line-height: 2;
}

.timeline {
  background: var(--v32-paper-soft) !important;
}

.timeline h2 {
  width: min(980px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.time-grid {
  max-width: 1040px !important;
}

.time-card {
  grid-template-columns: minmax(0, 1fr) 250px !important;
  gap: 42px !important;
}

.time-card h3 {
  color: var(--v32-green) !important;
}

.prefooter {
  margin-top: 0 !important;
}

@media (max-width:1100px) {
  .hero-vertical {
    display: none;
  }

  .bath-band-copy {
    width: min(640px, 78vw) !important;
  }
}

@media (max-width:980px) {
  .hero {
    min-height: 620px !important;
    padding: 116px 24px 66px !important;
  }

  .hero-inner {
    display: block !important;
  }

  .hero-period {
    margin-top: 22px;
    font-size: 14px;
    letter-spacing: .12em;
  }

  .intro {
    padding: 76px 24px 62px !important;
  }

  .intro-grid {
    display: block !important;
  }

  .seasonal-note-inner {
    display: block !important;
  }

  .seasonal-main {
    min-height: 330px !important;
  }

  .seasonal-sub {
    min-height: 210px !important;
    width: 74% !important;
    margin: -44px 24px 0 auto !important;
    border: 0 !important;
    position: relative !important;
    z-index: 2 !important;
  }

  .seasonal-copy {
    padding: 42px 24px 46px !important;
    margin: 0 !important;
  }

  .seasonal-copy:before,
  .seasonal-vertical {
    display: none !important;
  }

  .big-layout {
    padding: 74px 0 24px !important;
  }

  .dynamic-section,
  .dynamic-section.reverse {
    margin-bottom: 72px !important;
  }

  .dynamic-section .text,
  .dynamic-section.reverse .text {
    width: auto !important;
    max-width: none !important;
    margin: -22px 20px 0 !important;
    margin-left: 20px !important;
    margin-right: 20px !important;
    background: rgba(251, 248, 240, .96) !important;
    border: 0 !important;
  }

  .bath-band {
    min-height: 540px !important;
  }

  .bath-band-copy {
    left: 24px !important;
    right: 24px !important;
    top: auto !important;
    bottom: 42px !important;
    transform: none !important;
    width: auto !important;
    display: block !important;
  }

  .bath-band-copy h2 {
    writing-mode: horizontal-tb;
    font-size: 28px !important;
    line-height: 1.65 !important;
    letter-spacing: .06em !important;
    margin-bottom: 18px !important;
  }

  .bath-band-copy p {
    max-width: none !important;
  }

  .bath-dark-scene {
    padding: 68px 0 78px !important;
  }

  .bath-dark-content {
    width: 100% !important;
    min-height: auto !important;
  }

  .bath-dark-copy {
    width: auto !important;
    padding: 0 24px !important;
  }

  .bath-dark-main,
  .bath-dark-sub-01,
  .bath-dark-sub-02 {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    margin: 26px 24px 0 !important;
  }

  .bath-dark-main {
    height: 260px !important;
  }

  .bath-dark-sub-01,
  .bath-dark-sub-02 {
    height: 180px !important;
  }

  .bridge {
    display: block !important;
    min-height: auto !important;
  }

  .bridge-text {
    padding: 68px 24px 38px !important;
  }

  .bridge-photo {
    min-height: 300px !important;
  }

  .furin-section {
    padding: 70px 24px 82px !important;
    background: var(--v32-green) !important;
  }

  .furin-inner {
    display: block !important;
  }

  .furin-media {
    max-width: 280px !important;
    padding: 0 !important;
    margin: 34px auto 0 !important;
  }

  .furin-sound-mark {
    right: -34px;
    top: 22px;
    color: rgba(255, 255, 255, .84);
    font-size: 13px;
  }

  .time-card {
    display: block !important;
  }
}

@media (max-width:560px) {
  .hero-title .en {
    font-size: 37px !important;
  }

  .hero-title h1 {
    font-size: 31px !important;
  }

  .hero-period {
    gap: 10px;
    padding-right: 12px;
    font-size: 13px;
  }

  .hero-period span {
    font-size: 11px;
  }

  .seasonal-sub {
    width: 82% !important;
  }

  .bath-band {
    min-height: 510px !important;
  }

  .furin-sound-mark {
    right: -28px;
  }

  .intro h2 {
    font-size: 24px !important;
    line-height: 1.72 !important;
  }
}

/* v33 polish: center the bath vertical catch and lock clean title breaks. */
@media (min-width:981px) {
  .bath-band-copy {
    inset: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    transform: none !important;
    display: block !important;
  }

  .bath-band-copy h2 {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    writing-mode: vertical-rl !important;
    margin: 0 !important;
    font-size: 34px !important;
    line-height: 1.86 !important;
    letter-spacing: .14em !important;
    text-align: left !important;
  }

  .bath-band-kicker {
    position: absolute !important;
    right: 7.5vw !important;
    top: 23% !important;
    margin: 0 !important;
  }

  .bath-band-copy p {
    position: absolute !important;
    right: 7.5vw !important;
    top: 61% !important;
    max-width: 340px !important;
    margin: 0 !important;
  }

  .intro-grid {
    grid-template-columns: minmax(620px, 1fr) minmax(330px, 420px) !important;
    gap: clamp(54px, 6vw, 96px) !important;
  }

  .intro h2 {
    font-size: clamp(34px, 2.7vw, 39px) !important;
    line-height: 1.78 !important;
    letter-spacing: .07em !important;
    max-width: none !important;
  }

  .intro-line-pc {
    display: block !important;
    white-space: nowrap !important;
  }

  .intro-line-sp {
    display: none !important;
  }
}

@media (min-width:981px) and (max-width:1180px) {
  .intro-grid {
    grid-template-columns: 1fr !important;
    width: min(820px, 100%) !important;
  }

  .intro p {
    max-width: 38em !important;
    margin-top: 32px !important;
    padding-top: 0 !important;
  }
}

@media (max-width:980px) {
  .intro-line-pc {
    display: none !important;
  }

  .intro-line-sp {
    display: block !important;
    white-space: nowrap !important;
  }

  .intro h2 {
    overflow-wrap: normal !important;
    word-break: keep-all !important;
  }

  .bath-band-copy h2,
  .bath-band-copy p {
    position: static !important;
    transform: none !important;
  }
}

@media (max-width:560px) {
  .intro h2 {
    font-size: 23px !important;
    letter-spacing: .035em !important;
  }
}

/* Keep bridge headings from dropping punctuation onto separate lines. */
.bridge-text h2 {
  max-width: none !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

.bridge-line {
  display: block;
  white-space: nowrap;
}

@media (max-width:980px) {
  .bridge-text h2 {
    font-size: clamp(25px, 7.2vw, 30px) !important;
    line-height: 1.8 !important;
    letter-spacing: .055em !important;
    max-width: none !important;
  }
}

@media (max-width:420px) {
  .bridge-text h2 {
    font-size: 24px !important;
    letter-spacing: .035em !important;
  }
}

/* Replace section 03 with the provided summer shoji room photo. */
.visual.shoji {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .10)),
    url("../summer/assets/images/summer_shoji_207.jpg") center center / cover no-repeat !important;
}

.visual.water {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .02), rgba(0, 0, 0, .08)),
    url("../summer/assets/images/section01_foot_water.jpg") center center / cover no-repeat !important;
}

.time-photo.room {
  background-image: url("../summer/assets/images/summer_shoji_207.jpg") !important;
}

.time-photo.morning {
  background-image: url("../summer/assets/images/morning_yugawara_walk.jpg") !important;
  background-position: center center !important;
}

.time-photo.water {
  background-image: url("../summer/assets/images/day_foot_water.jpg") !important;
  background-position: center center !important;
}

.bridge-photo {
  background:
    linear-gradient(90deg, rgba(47, 42, 37, .06), rgba(47, 42, 37, .34)),
    url("../summer/assets/images/bridge_room_005.jpg") center center / cover no-repeat !important;
}