@charset "UTF-8";

/* ----------------------------------------
  おすすめ情報：枕（まくら）の選び方
---------------------------------------- */

html {
  overflow-x: clip;
}

/* ----- 締めリード ----- */
.block-makura .block-recommend-lead.-end {
  margin-top: 80px;
  font-weight: bold;
}

.block-makura .block-makura-endlead-mark {
  text-decoration: underline;
  text-underline-offset: 6px;
}

.block-makura .block-recommend-lead.-end .block-makura-endlead-mark b {
  font-size: 30px;
}

@media (max-width: 768px) {
  .block-makura .block-recommend-lead {
    margin-bottom: 32px;
    padding-inline: 24px;
  }

  .block-makura .block-recommend-lead.-end {
    margin-top: 56px;
    font-size: 18px;
  }

  .block-makura .block-recommend-lead.-end .block-makura-endlead-mark b {
    font-size: 22px;
  }
}

/* ----- 枕の選び方のコツ ----- */
.block-makura-kotsu {
  display: flex;
  align-items: center;
  column-gap: 56px;
  max-width: 1600px;
  margin: 120px auto 0;
  padding: 0;
  color: #333;
}

.block-makura-kotsu .block-makura-kotsu--thumb {
  flex-shrink: 0;
  width: 915px;
  max-width: 58%;
}

.block-makura-kotsu .block-makura-kotsu--thumb img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-kotsu .block-makura-kotsu--text {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.9;
}

.block-makura-kotsu .block-makura-kotsu--marker {
  font-size: 28px;
  font-weight: bold;
  background: linear-gradient(transparent 38%, #dfd4c4 38%);
}

@media (max-width: 768px) {
  .block-makura-kotsu {
    display: block;
    margin-top: 40px;
    padding: 0 24px;
  }

  .block-makura-kotsu .block-makura-kotsu--thumb {
    width: 100%;
    max-width: none;
  }

  .block-makura-kotsu .block-makura-kotsu--text {
    margin-top: 24px;
    font-size: 16px;
    text-align: center;
  }

  .block-makura-kotsu .block-makura-kotsu--marker {
    font-size: 18px;
  }
}

/* ----- 身体に合った枕選び ----- */
.block-makura-fit {
  margin-top: 100px;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 70px clamp(45px, calc(50vw - 795px), 70px) 60px;
  background: #eee;
  color: #333;
}

/* 中央見出し */
.block-makura-fit .block-makura-fit--title {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 40px;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0;
  background-image: none;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0.08em;
}

.block-makura-fit .block-makura-fit--title::before,
.block-makura-fit .block-makura-fit--title::after {
  flex: 1 1 auto;
  height: 2px;
  background: #333;
  content: "";
}

.block-makura-fit .block-makura-fit--list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 44px;
  max-width: 1600px;
  margin: 60px auto 0;
}

.block-makura-fit .block-makura-fit--panel {
  padding: 60px 56px 70px;
  background: #fff;
}

.block-makura-fit .block-makura-fit--q,
.block-makura-fit .block-makura-fit--a {
  display: flex;
  column-gap: 14px;
  margin: 0;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.5;
}

.block-makura-fit .block-makura-fit--a {
  margin-top: 16px;
}

.block-makura-fit .block-makura-fit--mark {
  flex-shrink: 0;
}

.block-makura-fit .block-makura-fit--text {
  margin: 28px 0 0;
  font-size: 20px;
  line-height: 2;
}

.block-makura-fit .block-makura-fit--thumb {
  margin-top: 40px;
}

.block-makura-fit .block-makura-fit--thumb img {
  display: block;
  width: 100%;
  max-width: 679px;
  height: auto;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .block-makura-fit {
    margin-top: 56px;
    padding: 44px 24px 48px;
  }

  .block-makura-fit .block-makura-fit--title {
    column-gap: 16px;
    font-size: 26px;
  }

  .block-makura-fit .block-makura-fit--list {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 32px;
  }

  .block-makura-fit .block-makura-fit--panel {
    padding: 32px 20px 36px;
  }

  .block-makura-fit .block-makura-fit--q,
  .block-makura-fit .block-makura-fit--a {
    column-gap: 10px;
    font-size: 18px;
  }

  .block-makura-fit .block-makura-fit--text {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.9;
  }

  .block-makura-fit .block-makura-fit--thumb {
    margin-top: 28px;
  }
}

/* ----- 枕選びの3ポイント ----- */
.block-makura-point {
  max-width: 1600px;
  margin: 60px auto 0;
  padding: 0;
  color: #333;
}

/* 中央見出し */
.block-makura-point .block-makura-point--title {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 40px;
  margin: 0;
  padding: 0;
  background-image: none;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0.08em;
}

.block-makura-point .block-makura-point--title::before,
.block-makura-point .block-makura-point--title::after {
  flex: 1 1 auto;
  height: 2px;
  background: #333;
  content: "";
}

/* アンカータブ */
.block-makura-point .block-makura-point--tabs {
  display: flex;
  gap: 40px;
  margin: 50px 0 0;
  padding: 0;
  list-style: none;
}

.block-makura-point .block-makura-point--tab-item {
  flex: 1 1 0;
}

.block-makura-point .block-makura-point--tab {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  padding: 18px 24px;
  border-radius: 50vh;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
  color: #333;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-point .block-makura-point--tab::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-bottom: 2px solid #333;
  border-right: 2px solid #333;
  rotate: 45deg;
  translate: 0 -2px;
  content: "";
}

/* Point.NN バナー */
.block-makura-point .block-makura-point--banner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  margin-top: 100px;
  background: #c8d1e6;
}

.block-makura-point .block-makura-point--banner-num {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  width: 300px;
  padding-left: 50px;
  background: #213361;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.04em;
  clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 50%, calc(100% - 34px) 100%, 0 100%);
}

.block-makura-point .block-makura-point--banner-label {
  font-size: 40px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

/* 本文ブロック */
.block-makura-point .block-makura-point--block {
  margin-top: 60px;
}

.block-makura-point .block-makura-point--block + .block-makura-point--block {
  margin-top: 100px;
}

.block-makura-point .block-makura-point--heading {
  margin: 0 0 20px;
  font-size: 30px;
  font-weight: bold;
  line-height: 1.5;
}

.block-makura-point .block-makura-point--text {
  margin: 0;
  font-size: 20px;
  line-height: 2;
}

.block-makura-point .block-makura-point--columns {
  display: flex;
  align-items: flex-start;
  column-gap: 56px;
}

.block-makura-point .block-makura-point--columns .block-makura-point--text {
  flex: 1 1 auto;
  min-width: 0;
}

.block-makura-point .block-makura-point--figure {
  flex-shrink: 0;
  width: 760px;
  max-width: 50%;
  padding: 30px 40px;
  background: #fff;
}

.block-makura-point .block-makura-point--figure img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-point .block-makura-point--figlist {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px 44px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.block-makura-point .block-makura-point--figlist.-large {
  grid-template-columns: repeat(2, 1fr);
  gap: 44px;
}

.block-makura-point .block-makura-point--figitem-thumb img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-point .block-makura-point--figitem-text {
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 1.8;
}

.block-makura-point .block-makura-point--text + .block-makura-point--figlist {
  margin-top: 30px;
}

.block-makura-point .block-makura-point--banner:first-child {
  margin-top: 0;
}

.block-makura-point .block-makura-point--photos {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-top: 40px;
}

.block-makura-point .block-makura-point--photo {
  flex: 0 1 504px;
}

.block-makura-point .block-makura-point--photo img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-point .block-makura-point--sizecards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin-top: 40px;
}

.block-makura-point .block-makura-point--sizecard {
  display: flex;
  flex-direction: column;
  background: #fff;
}

.block-makura-point .block-makura-point--sizecard-head {
  margin: 0;
  padding: 16px 20px;
  background: #ededed;
  text-align: center;
  font-size: 22px;
  font-weight: bold;
}

.block-makura-point .block-makura-point--sizecard-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 28px 32px 36px;
}

.block-makura-point .block-makura-point--sizecard-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.9;
}

.block-makura-point .block-makura-point--sizecard-spec {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.7;
}

.block-makura-point .block-makura-point--sizecard-action {
  display: flex;
  justify-content: center;
  margin-top: auto;
  padding-top: 30px;
}

.block-makura-point .block-makura-point--sizecard-button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 360px;
  padding: 16px 24px;
  border-radius: 50vh;
  background: #222;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-point .block-makura-point--sizecard-button::after {
  display: block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-point .block-makura-point--tab:is(:hover, :focus),
  .block-makura-point .block-makura-point--sizecard-button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-point {
    margin-top: 56px;
    padding: 0 24px;
  }

  .block-makura-point .block-makura-point--title {
    column-gap: 16px;
    font-size: 24px;
  }

  .block-makura-point .block-makura-point--tabs {
    gap: 8px;
    margin-top: 28px;
  }

  .block-makura-point .block-makura-point--tab {
    column-gap: 6px;
    padding: 14px 8px;
    font-size: 14px;
  }

  .block-makura-point .block-makura-point--banner {
    min-height: 64px;
    margin-top: 40px;
    padding-left: 150px;
  }

  .block-makura-point .block-makura-point--banner-num {
    width: 140px;
    padding-left: 16px;
    font-size: 15px;
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 0 100%);
  }

  .block-makura-point .block-makura-point--banner-label {
    font-size: 24px;
  }

  .block-makura-point .block-makura-point--block {
    margin-top: 50px;
  }

  .block-makura-point .block-makura-point--block + .block-makura-point--block {
    margin-top: 50px;
  }

  .block-makura-point .block-makura-point--heading {
    margin-bottom: 16px;
    font-size: 22px;
  }

  .block-makura-point .block-makura-point--text {
    font-size: 16px;
    line-height: 1.9;
  }

  .block-makura-point .block-makura-point--columns {
    display: block;
  }

  .block-makura-point .block-makura-point--figure {
    width: 100%;
    max-width: none;
    margin-top: 24px;
    padding: 20px;
  }

  .block-makura-point .block-makura-point--figlist {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 12px;
    margin-top: 20px;
  }

  .block-makura-point .block-makura-point--figlist.-large {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .block-makura-point .block-makura-point--figitem-text {
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.7;
  }

  .block-makura-point .block-makura-point--text + .block-makura-point--figlist {
    margin-top: 20px;
  }

  .block-makura-point .block-makura-point--photos {
    gap: 12px;
    margin-top: 28px;
  }

  .block-makura-point .block-makura-point--sizecards {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 28px;
  }

  .block-makura-point .block-makura-point--sizecard-head {
    padding: 14px 16px;
    font-size: 18px;
  }

  .block-makura-point .block-makura-point--sizecard-body {
    padding: 20px 20px 28px;
  }

  .block-makura-point .block-makura-point--sizecard-text {
    font-size: 14px;
    line-height: 1.8;
  }

  .block-makura-point .block-makura-point--sizecard-spec {
    font-size: 13px;
  }

  .block-makura-point .block-makura-point--sizecard-action {
    padding-top: 24px;
  }

  .block-makura-point .block-makura-point--sizecard-button {
    padding: 14px 20px;
    font-size: 14px;
  }
}

/* ----- もし、枕の高さがしっくりこない場合は… ----- */
.block-makura-adjust {
  margin-top: 120px;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 80px clamp(45px, calc(50vw - 795px), 70px);
  background: #eee;
  color: #333;
}

.block-makura-adjust .block-makura-adjust--head {
  max-width: 1600px;
  margin: 0 auto;
}

.block-makura-adjust .block-makura-adjust--heading {
  margin: 0;
  font-size: 30px;
  font-weight: bold;
  line-height: 1.5;
}

.block-makura-adjust .block-makura-adjust--intro {
  margin: 20px 0 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 2;
}

.block-makura-adjust .block-makura-adjust--list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 44px;
  max-width: 1600px;
  margin: 60px auto 0;
}

.block-makura-adjust .block-makura-adjust--panel {
  display: flex;
  flex-direction: column;
  padding: 60px 90px;
  background: #fff;
}

/* パネル見出し */
.block-makura-adjust .block-makura-adjust--title {
  margin: 0;
  padding-bottom: 20px;
  border-bottom: 1px solid #333;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
}

.block-makura-adjust .block-makura-adjust--lead {
  margin: 26px 0 0;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.6;
}

.block-makura-adjust .block-makura-adjust--note {
  margin: 12px 0 0;
  text-align: center;
  font-size: 14px;
  line-height: 1.6;
}

.block-makura-adjust .block-makura-adjust--fig {
  margin-top: 40px;
  text-align: center;
}

.block-makura-adjust .block-makura-adjust--fig img {
  display: inline-block;
  width: auto;
  max-width: 100%;
  height: auto;
}

.block-makura-adjust .block-makura-adjust--sublabel {
  margin: 40px 0 0;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}

.block-makura-adjust .block-makura-adjust--text {
  margin: 30px 0 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.9;
}

.block-makura-adjust .block-makura-adjust--action {
  display: flex;
  justify-content: center;
  margin-top: auto;
  padding-top: 65px;
}

.block-makura-adjust .block-makura-adjust--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 520px;
  padding: 20px 28px;
  border-radius: 50vh;
  background: #222;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-adjust .block-makura-adjust--button::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-adjust .block-makura-adjust--button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-adjust {
    margin-top: 56px;
    padding: 44px 24px 48px;
  }

  .block-makura-adjust .block-makura-adjust--heading {
    font-size: 20px;
  }

  .block-makura-adjust .block-makura-adjust--intro {
    margin-top: 16px;
    font-size: 16px;
    line-height: 1.9;
  }

  .block-makura-adjust .block-makura-adjust--list {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 32px;
  }

  .block-makura-adjust .block-makura-adjust--panel {
    padding: 32px 20px 36px;
  }

  .block-makura-adjust .block-makura-adjust--title {
    padding-bottom: 16px;
    font-size: 20px;
  }

  .block-makura-adjust .block-makura-adjust--lead {
    margin-top: 20px;
    font-size: 16px;
  }

  .block-makura-adjust .block-makura-adjust--note {
    font-size: 13px;
  }

  .block-makura-adjust .block-makura-adjust--fig {
    margin-top: 28px;
  }

  .block-makura-adjust .block-makura-adjust--sublabel {
    margin-top: 28px;
  }

  .block-makura-adjust .block-makura-adjust--action {
    padding-top: 32px;
  }

  .block-makura-adjust .block-makura-adjust--button {
    padding: 16px 20px;
    font-size: 17px;
  }
}

/* ----- オーダーメイド枕ギフト券／スマホ診断 ----- */
.block-makura-ordermade {
  margin-top: 0;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 0 clamp(45px, calc(50vw - 795px), 70px) 120px;
  background: #eee;
  color: #333;
}

.block-makura-ordermade .block-makura-ordermade--panel {
  max-width: 1600px;
  margin: 0 auto;
  background: #fff;
}

.block-makura-ordermade .block-makura-ordermade--head {
  margin: 0;
  padding: 28px 20px;
  background: #979797;
  color: #fff;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

.block-makura-ordermade .block-makura-ordermade--body {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60px;
  padding: 56px 60px 64px;
}

.block-makura-ordermade .block-makura-ordermade--col {
  display: flex;
  flex-direction: column;
}

.block-makura-ordermade .block-makura-ordermade--title {
  margin: 0;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  line-height: 1.5;
  min-height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.block-makura-ordermade .block-makura-ordermade--thumb {
  margin-top: 30px;
}

.block-makura-ordermade .block-makura-ordermade--thumb img {
  display: block;
  width: 100%;
  max-width: 685px;
  height: auto;
  margin: 0 auto;
}

.block-makura-ordermade .block-makura-ordermade--text {
  margin: 24px 0 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.9;
}

/* 診断をするボタン */
.block-makura-ordermade .block-makura-ordermade--action {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

.block-makura-ordermade .block-makura-ordermade--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 520px;
  padding: 20px 28px;
  border-radius: 50vh;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .12);
  color: #333;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-ordermade .block-makura-ordermade--button::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #333;
  border-right: 2px solid #333;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-ordermade .block-makura-ordermade--button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-ordermade {
    padding: 0 24px 48px;
  }

  .block-makura-ordermade .block-makura-ordermade--head {
    padding: 20px 16px;
    font-size: 20px;
  }

  .block-makura-ordermade .block-makura-ordermade--body {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 32px 20px 36px;
  }

  .block-makura-ordermade .block-makura-ordermade--title {
    font-size: 20px;
    min-height: auto;
  }

  .block-makura-ordermade .block-makura-ordermade--thumb {
    margin-top: 20px;
  }

  .block-makura-ordermade .block-makura-ordermade--text {
    margin-top: 20px;
    font-size: 16px;
  }

  .block-makura-ordermade .block-makura-ordermade--action {
    padding-top: 24px;
  }

  .block-makura-ordermade .block-makura-ordermade--button {
    padding: 16px 20px;
    font-size: 18px;
  }
}

/* ----- 首の高さは人によってこんなに違います ----- */
.block-makura-neck {
  max-width: 1600px;
  margin: 120px auto 0;
  padding: 44px clamp(45px, calc(50vw - 795px), 70px) 40px;
  background: #ccc;
  color: #333;
}

.block-makura-neck .block-makura-neck--headline {
  margin: 0;
  text-align: center;
  font-size: 40px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

/* アンカータブ */
.block-makura-neck .block-makura-neck--tabs {
  display: flex;
  gap: 40px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.block-makura-neck .block-makura-neck--tab-item {
  display: flex;
  flex: 1 1 0;
}

.block-makura-neck .block-makura-neck--tab {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  padding: 18px 20px;
  border-radius: 50vh;
  background: #fff;
  color: #333;
  font-size: 17px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-neck .block-makura-neck--tab::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-bottom: 2px solid #333;
  border-right: 2px solid #333;
  rotate: 45deg;
  translate: 0 -2px;
  content: "";
}

/* 各体型の商品ブロック */
.block-event-list-wrap:has(.block-makura-neck--intro) {
  max-width: 1600px;
  margin: 0 auto;
  padding: 60px 40px 60px;
  background: #fff;
}

.block-makura-neck--intro {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 60px;
}

.block-makura-neck--intro-head {
  text-align: center;
}

.block-makura-neck--intro .block-makura-neck--title {
  margin: 0 0 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid #333;
  font-size: 30px;
  font-weight: bold;
}

.block-makura-neck--intro .block-makura-neck--sub {
  margin: 0;
  font-size: 25px;
  font-weight: 500;
}

.block-makura-neck--intro .block-makura-neck--fig {
  flex-shrink: 0;
  width: 481px;
  max-width: 40%;
}

.block-makura-neck--intro .block-makura-neck--fig img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.block-event-list-wrap:has(.block-makura-neck--intro) .block-makura-items {
  margin-top: 40px;
}

.block-event-list-wrap:has(.block-makura-goods--head) .block-makura-items {
  margin-top: 50px;
}

.block-makura-items .block-makura-item {
  display: flex;
  flex-direction: column;
  padding: 20px 50px 40px;
  background: #eee;
}

.block-makura-items .block-makura-item--num {
  margin: 0 0 12px;
  font-size: 40px;
  font-weight: 500;
  line-height: 1;
  color: #555;
  text-align: center;
}

.block-makura-hard--col .block-makura-items {
  grid-template-columns: minmax(0, 1fr);
  margin-top: 30px;
}

.block-makura-items .block-makura-item--thumb img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-items .block-makura-item--name {
  margin: 16px 0 0;
  font-size: 15px;
  line-height: 1.6;
  color: #333;
}

.block-makura-items .block-makura-item--price {
  margin: 14px 0 0;
  text-align: right;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.2;
  color: #333;
}

.block-makura-items .block-makura-item--price-tax {
  margin-left: 4px;
  font-size: 14px;
  font-weight: normal;
}

.block-makura-items .block-makura-item--action {
  margin-top: auto;
  padding-top: 24px;
}

.block-makura-items .block-makura-item--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 10px;
  padding: 14px 16px;
  border-radius: 50vh;
  background: #af8e60;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  transition: opacity .3s ease;
}

.block-makura-items .block-makura-item--button::after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
}

@media (min-width: 769px) {
  .block-makura-items .block-makura-item--button:is(:hover, :focus) {
    opacity: .7;
  }
}

@media (max-width: 768px) {
  .block-makura-items {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .block-makura-items .block-makura-item {
    padding: 12px 12px 20px;
  }

  .block-makura-items .block-makura-item--name {
    font-size: 13px;
  }

  .block-makura-items .block-makura-item--price {
    font-size: 20px;
  }

  .block-makura-items .block-makura-item--price-tax {
    font-size: 10px;
  }

  .block-makura-items .block-makura-item--button {
    font-size: 14px;
  }
}

.block-makura-neck--foot {
  display: flex;
  justify-content: center;
  margin-top: 50px;
}

.block-makura-neck--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 520px;
  padding: 20px 28px;
  border-radius: 50vh;
  background: #222;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-neck--button::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-neck .block-makura-neck--tab:is(:hover, :focus),
  .block-makura-neck--button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-neck {
    margin-top: 56px;
    padding: 28px 16px 24px;
  }

  .block-makura-neck .block-makura-neck--headline {
    font-size: 24px;
  }

  .block-makura-neck .block-makura-neck--tabs {
    gap: 8px;
    margin-top: 20px;
  }

  .block-makura-neck .block-makura-neck--tab {
    column-gap: 6px;
    padding: 12px 6px;
    font-size: 12px;
  }

  .block-event-list-wrap:has(.block-makura-neck--intro) {
    padding: 32px 24px 36px;
  }

  .block-makura-neck--intro {
    display: block;
    text-align: center;
  }

  .block-makura-neck--intro .block-makura-neck--title {
    margin-bottom: 16px;
    padding-bottom: 16px;
    font-size: 22px;
  }

  .block-makura-neck--intro .block-makura-neck--sub {
    font-size: 18px;
  }

  .block-makura-neck--intro .block-makura-neck--fig {
    width: 60%;
    max-width: none;
    margin: 24px auto 0;
  }

  .block-event-list-wrap:has(.block-makura-neck--intro) .block-top-event--goods {
    margin-top: 28px;
  }

  .block-makura-neck--foot {
    margin-top: 32px;
  }

  .block-makura-neck--button {
    padding: 16px 20px;
    font-size: 18px;
  }
}

/* ----- 人気のサイズ ----- */
.block-makura-popular {
  margin-top: 100px;
  padding: 0;
  color: #333;
}

.block-makura-popular .block-makura-popular--panel {
  max-width: 1600px;
  margin: 0 auto;
  background: #fff;
}

.block-makura-popular .block-makura-popular--head {
  margin: 0;
  padding: 24px 20px;
  background: #979797;
  color: #fff;
  text-align: center;
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

.block-makura-popular .block-makura-popular--body {
  padding: 50px 60px 60px;
}

.block-makura-popular .block-makura-popular--intro {
  margin: 0;
  text-align: center;
  font-size: 20px;
  line-height: 1.9;
}

.block-makura-popular .block-makura-popular--cols {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 40px;
}

.block-makura-popular .block-makura-popular--col {
  display: flex;
  flex-direction: column;
  padding: 0 50px;
}

.block-makura-popular .block-makura-popular--col + .block-makura-popular--col {
  border-left: 1px solid #ccc;
}

.block-makura-popular .block-makura-popular--col-title {
  margin: 0;
  text-align: center;
  font-size: 25px;
  font-weight: bold;
}

.block-makura-popular .block-makura-popular--col-text {
  margin: 20px 0 0;
  font-size: 20px;
  line-height: 1.9;
}

.block-makura-popular .block-makura-popular--col-action {
  display: flex;
  justify-content: center;
  margin-top: auto;
  padding-top: 40px;
}

.block-makura-popular .block-makura-popular--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 490px;
  padding: 20px 28px;
  border-radius: 50vh;
  background: #222;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-popular .block-makura-popular--button::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

/* ----- おすすめ商品ブロック ----- */
.block-event-list-wrap:has(.block-makura-goods--head) {
  max-width: 1600px;
  margin: 100px auto 0;
  padding: 56px clamp(45px, calc(50vw - 795px), 70px) 60px;
  background: #fff;
  color: #333;
}

.block-makura-goods--head {
  text-align: center;
}

.block-makura-goods--title {
  margin: 0;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.block-event-list-wrap:has(.block-makura-goods--head) .block-top-event--goods {
  margin-top: 50px;
}

.block-makura-goods--foot {
  display: flex;
  justify-content: center;
  margin-top: 50px;
}

.block-makura-goods--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 520px;
  padding: 20px 28px;
  border-radius: 50vh;
  background: #222;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-goods--button::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-popular .block-makura-popular--button:is(:hover, :focus),
  .block-makura-goods--button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-popular {
    margin-top: 56px;
  }

  .block-makura-popular .block-makura-popular--head {
    padding: 18px 16px;
    font-size: 22px;
  }

  .block-makura-popular .block-makura-popular--body {
    padding: 32px 24px 36px;
  }

  .block-makura-popular .block-makura-popular--intro {
    font-size: 16px;
    text-align: left;
  }

  .block-makura-popular .block-makura-popular--cols {
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 28px;
  }

  .block-makura-popular .block-makura-popular--col {
    padding: 0;
  }

  .block-makura-popular .block-makura-popular--col + .block-makura-popular--col {
    padding-top: 32px;
    border-left: 0;
    border-top: 1px solid #ccc;
  }

  .block-makura-popular .block-makura-popular--col-title {
    font-size: 18px;
  }

  .block-makura-popular .block-makura-popular--col-text {
    margin-top: 16px;
    font-size: 16px;
  }

  .block-makura-popular .block-makura-popular--col-action {
    padding-top: 28px;
  }

  .block-makura-popular .block-makura-popular--button {
    padding: 16px 20px;
    font-size: 14px;
  }

  .block-event-list-wrap:has(.block-makura-goods--head) {
    margin-top: 56px;
    padding: 32px 24px 36px;
  }

  .block-makura-goods--title {
    font-size: 22px;
  }

  .block-event-list-wrap:has(.block-makura-goods--head) .block-top-event--goods {
    margin-top: 32px;
  }

  .block-makura-goods--foot {
    margin-top: 32px;
  }

  .block-makura-goods--button {
    padding: 16px 20px;
    font-size: 18px;
  }
}

/* ----- Point.03  ----- */
.block-makura-point .block-makura-point--heading.-center {
  text-align: center;
}

/* 好み硬さの素材写真 */
.block-makura-point .block-makura-point--figure.-sozai {
  width: 367px;
  max-width: 30%;
  padding: 0;
  background: none;
}

/* 各素材の特徴 */
.block-makura-mat {
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.block-makura-mat .block-makura-mat--item {
  display: flex;
  align-items: center;
  column-gap: 50px;
  padding: 40px 56px;
  background: #fff;
}

.block-makura-mat .block-makura-mat--item + .block-makura-mat--item {
  margin-top: 30px;
}

.block-makura-mat .block-makura-mat--photo {
  flex-shrink: 0;
  width: 237px;
}

.block-makura-mat .block-makura-mat--photo img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-mat .block-makura-mat--body {
  flex: 1 1 auto;
  min-width: 0;
}

.block-makura-mat .block-makura-mat--name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  column-gap: 20px;
  row-gap: 10px;
  margin: 0;
  font-size: 30px;
  font-weight: bold;
}

.block-makura-mat .block-makura-mat--tag {
  padding: 6px 16px;
  background: #ededed;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 500;
}

.block-makura-mat .block-makura-mat--text {
  margin: 20px 0 0;
  font-size: 20px;
  line-height: 1.9;
}

.block-makura-mat .block-makura-mat--marks {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.block-makura-mat .block-makura-mat--mark {
  padding: 8px 18px;
  border: 1px solid #999;
  font-size: 14px;
}

/* 素材の特徴 */
.block-makura-matcompare {
  margin-top: 30px;
  overflow-x: auto;
}

.block-makura-matcompare .block-makura-matcompare--table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  text-align: center;
}

.block-makura-matcompare .block-makura-matcompare--table thead th {
  padding: 20px 10px;
  border: 1px solid #999;
  background: #999;
  color: #fff;
  font-size: 17px;
  font-weight: bold;
}

.block-makura-matcompare .block-makura-matcompare--table tbody th {
  width: 28%;
  padding: 20px 24px;
  border: 1px solid #ccc;
  background: #fff;
  text-align: left;
  font-size: 16px;
  font-weight: 500;
}

.block-makura-matcompare .block-makura-matcompare--table tbody td {
  padding: 18px 10px;
  border: 1px solid #ccc;
  background: #fff;
  font-size: 20px;
}

@media (max-width: 768px) {
  .block-makura-point .block-makura-point--figure.-sozai {
    width: 60%;
    max-width: none;
    margin: 24px auto 0;
  }

  .block-makura-mat .block-makura-mat--item {
    display: block;
    padding: 28px 20px;
  }

  .block-makura-mat .block-makura-mat--item + .block-makura-mat--item {
    margin-top: 16px;
  }

  .block-makura-mat .block-makura-mat--photo {
    width: 140px;
    margin: 0 auto 20px;
  }

  .block-makura-mat .block-makura-mat--name {
    justify-content: center;
    font-size: 20px;
  }

  .block-makura-mat .block-makura-mat--tag {
    font-size: 13px;
  }

  .block-makura-mat .block-makura-mat--text {
    font-size: 16px;
    line-height: 1.8;
  }

  .block-makura-mat .block-makura-mat--marks {
    justify-content: center;
    gap: 10px;
  }

  .block-makura-mat .block-makura-mat--mark {
    padding: 6px 12px;
    font-size: 13px;
  }

  .block-makura-matcompare .block-makura-matcompare--table thead th {
    padding: 14px 6px;
    font-size: 14px;
  }

  .block-makura-matcompare .block-makura-matcompare--table tbody th {
    padding: 14px 12px;
    font-size: 14px;
  }

  .block-makura-matcompare .block-makura-matcompare--table tbody td {
    padding: 14px 6px;
    font-size: 17px;
  }
}

/* ----- 硬さ3分類 ----- */
.block-makura-hard {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 44px;
  max-width: 1600px;
  margin: 100px auto 0;
  padding: 0;
  color: #333;
}

.block-makura-hard .block-makura-hard--col {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-bottom: 0;
  background: #fff;
}

.block-makura-hard .block-makura-hard--head {
  margin: 0;
  padding: 18px 16px;
  background: #e8e8e8;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.block-makura-hard .block-makura-hard--body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 48px 32px 36px;
}

.block-makura-hard .block-makura-hard--intro {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  column-gap: 40px;
  min-height: 170px;
}

.block-makura-hard .block-makura-hard--rep-label {
  margin: 0;
  font-size: 15px;
}

.block-makura-hard .block-makura-hard--rep-tags {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin: 12px 0 0;
}

.block-makura-hard .block-makura-hard--tag {
  padding: 6px 20px;
  background: #928a78;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
}

.block-makura-hard .block-makura-hard--wash {
  margin: 14px 0 0;
  font-size: 15px;
}

.block-makura-hard .block-makura-hard--photo {
  flex-shrink: 0;
  width: 130px;
}

.block-makura-hard .block-makura-hard--photo img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-hard .block-makura-hard--desc {
  margin: 32px 0 0;
  text-align: center;
  font-size: 20px;
  line-height: 1.7;
}

/* 自動生成の商品カード */
.block-makura-hard .block-makura-hard--col .block-top-event--goods {
  margin-top: 40px;
}

.block-makura-hard .block-makura-hard--foot {
  display: flex;
  justify-content: center;
  margin-top: auto;
  padding-top: 30px;
}

.block-makura-hard .block-makura-hard--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 10px;
  width: 100%;
  padding: 18px 16px;
  border-radius: 50vh;
  background: #222;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-hard .block-makura-hard--button::after {
  display: block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-hard .block-makura-hard--button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 1100px) {
  .block-makura-hard {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 56px;
    padding: 0 24px;
  }
}

@media (max-width: 768px) {
  .block-makura-hard .block-makura-hard--head {
    padding: 14px 16px;
    font-size: 18px;
  }

  .block-makura-hard .block-makura-hard--body {
    padding: 24px 20px 28px;
  }

  .block-makura-hard .block-makura-hard--intro {
    min-height: 0;
  }

  .block-makura-hard .block-makura-hard--tag {
    font-size: 14px;
  }

  .block-makura-hard .block-makura-hard--photo {
    width: 110px;
  }

  .block-makura-hard .block-makura-hard--desc {
    font-size: 16px;
  }

  .block-makura-hard .block-makura-hard--button {
    padding: 16px 20px;
    font-size: 18px;
  }
}

/* ----- 「眠りのプロ」スリープマスターの豆知識 ----- */
.block-makura-master {
  max-width: 1600px;
  margin: 100px auto 0;
  padding: 0;
  color: #333;
}

.block-makura-master .block-makura-master--title {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 40px;
  margin: 0;
  padding: 0;
  background-image: none;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-align: center;
}

.block-makura-master .block-makura-master--title::before,
.block-makura-master .block-makura-master--title::after {
  flex: 1 1 auto;
  height: 2px;
  background: #333;
  content: "";
}

.block-makura-master .block-makura-master--row {
  display: flex;
  align-items: flex-start;
  column-gap: 60px;
  margin-top: 60px;
}

.block-makura-master .block-makura-master--body {
  flex: 1 1 0;
  min-width: 0;
}

.block-makura-master .block-makura-master--photo,
.block-makura-master .block-makura-master--fig {
  flex: 1 1 0;
  min-width: 0;
}

.block-makura-master .block-makura-master--photo img,
.block-makura-master .block-makura-master--fig img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-master .block-makura-master--subtitle {
  margin: 0 0 26px;
  font-size: 30px;
  font-weight: bold;
  line-height: 1.5;
}

.block-makura-master .block-makura-master--point {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: bold;
}

.block-makura-master .block-makura-master--marker {
  background: linear-gradient(transparent 38%, #dfd4c4 38%);
}

.block-makura-master .block-makura-master--text {
  margin: 0;
  font-size: 20px;
  line-height: 2;
}

/* 相談パネル */
.block-makura-master .block-makura-master--consult {
  margin-top: 70px;
  padding: 30px;
  background: #fff;
  text-align: center;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .16);
}

.block-makura-master .block-makura-master--consult-inner {
  border: 1px solid #707070;
  padding: 40px;
}

.block-makura-master .block-makura-master--consult-title {
  margin: 0;
  font-size: 40px;
  font-weight: bold;
}

.block-makura-master .block-makura-master--consult-text {
  margin: 20px 0 0;
  font-size: 20px;
  line-height: 1.7;
}

.block-makura-master .block-makura-master--consult-action {
  display: flex;
  justify-content: center;
  margin-top: 36px;
}

.block-makura-master .block-makura-master--consult-button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  width: 100%;
  max-width: 490px;
  padding: 20px 28px;
  border-radius: 50vh;
  background: #af8e60;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-master .block-makura-master--consult-button::after {
  display: block;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-master .block-makura-master--consult-button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-master {
    margin-top: 56px;
    padding: 0 24px;
  }

  .block-makura-master .block-makura-master--title {
    column-gap: 16px;
    font-size: 24px;
  }

  .block-makura-master .block-makura-master--row {
    display: block;
    margin-top: 32px;
  }

  .block-makura-master .block-makura-master--photo,
  .block-makura-master .block-makura-master--fig {
    margin-top: 24px;
  }

  .block-makura-master .block-makura-master--body {
    margin-top: 24px;
  }

  .block-makura-master .block-makura-master--subtitle {
    margin-bottom: 16px;
    font-size: 18px;
  }

  .block-makura-master .block-makura-master--point {
    font-size: 17px;
  }

  .block-makura-master .block-makura-master--text {
    font-size: 16px;
    line-height: 1.9;
  }

  .block-makura-master .block-makura-master--consult {
    margin-top: 40px;
    padding: 36px 20px;
  }

  .block-makura-master .block-makura-master--consult-title {
    font-size: 24px;
  }

  .block-makura-master .block-makura-master--consult-text {
    margin-top: 14px;
    font-size: 16px;
  }

  .block-makura-master .block-makura-master--consult-action {
    margin-top: 28px;
  }

  .block-makura-master .block-makura-master--consult-button {
    padding: 16px 20px;
    font-size: 14px;
  }
}

/* ----- 枕に関する「よくあるご質問」 ----- */
.block-makura-faq {
  margin-top: 100px;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 90px clamp(45px, calc(50vw - 795px), 70px);
  background: #fff;
  color: #333;
}

.block-makura-faq .block-makura-faq--inner {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0;
}

/* ----- カテゴリリンク ----- */
.block-makura-category {
  margin: 44px auto 0;
  padding: 0 clamp(45px, calc(50vw - 795px), 70px);
}

.block-makura-category .block-makura-category--list {
  max-width: 1600px;
  display: flex;
  flex-wrap: wrap;
  gap: 44px;
  margin: 0 auto;
  padding: 0;
}

.block-makura-category .block-makura-category--item {
  width: calc((100% / 5) - 36px);
}

.block-makura-category .block-makura-category--link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 28px;
  border-radius: 50vh;
  background: #fff;
  color: #333;
  font-size: 15px;
  font-weight: normal;
  text-decoration: none;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .1);
  height: 100%;
  transition: var(--transition-opacity);
}

.block-makura-category .block-makura-category--link::after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-top: 1px solid #333;
  border-right: 1px solid #333;
  rotate: 45deg;
}

@media (min-width: 769px) {
  .block-makura-category .block-makura-category--link:is(:hover, :focus) {
    opacity: .6;
  }
}

@media (max-width: 768px) {
  .block-makura-category {
    margin-top: 0;
    margin-bottom: 64px;
    padding: 0 24px;
  }

  .block-makura-category .block-makura-category--list {
    flex-direction: column;
    gap: 10px;
  }
  .block-makura-category .block-makura-category--item {
    width: 100%;
  }

  .block-makura-category .block-makura-category--link {
    padding: 11px 18px;
    font-size: 13px;
    height: 100%;
  }
}

.block-makura-faq .block-makura-faq--title {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 40px;
  margin: 0;
  padding: 0;
  background-image: none;
  font-size: 40px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-align: center;
}

.block-makura-faq .block-makura-faq--title::before,
.block-makura-faq .block-makura-faq--title::after {
  flex: 1 1 auto;
  height: 2px;
  background: #333;
  content: "";
}

.block-makura-faq .block-makura-faq--list {
  margin: 50px 0 0;
}

.block-makura-faq .block-makura-faq--item {
  border-bottom: 1px solid #ccc;
}

.block-makura-faq .block-makura-faq--q {
  margin: 0;
}

.block-makura-faq .block-makura-faq--q-button {
  appearance: none;
  display: flex;
  align-items: center;
  column-gap: 16px;
  width: 100%;
  padding: 28px 8px;
  border: 0;
  background: none;
  color: #333;
  text-align: left;
  cursor: pointer;
}

.block-makura-faq .block-makura-faq--q-mark {
  flex-shrink: 0;
  font-size: 22px;
  font-weight: bold;
}

.block-makura-faq .block-makura-faq--q-text {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
}

.block-makura-faq .block-makura-faq--q-icon {
  position: relative;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
}

.block-makura-faq .block-makura-faq--q-icon::before,
.block-makura-faq .block-makura-faq--q-icon::after {
  position: absolute;
  background: #333;
  content: "";
}

.block-makura-faq .block-makura-faq--q-icon::before {
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  translate: 0 -50%;
}

.block-makura-faq .block-makura-faq--q-icon::after {
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  translate: -50% 0;
  transition: var(--transition-all);
}

.block-makura-faq .block-makura-faq--q-button.is-expanded .block-makura-faq--q-icon::after {
  opacity: 0;
}

.block-makura-faq .block-makura-faq--a {
  display: none;
  margin: 0;
  padding: 0 8px 28px 50px;
}

.block-makura-faq .block-makura-faq--a.is-expanded {
  display: block;
}

.block-makura-faq--a-ttl {
  margin-top: 24px;
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 20px;
  font-weight: bold;
}

.block-makura-faq--a-ttl:first-child {
  margin-top: 0;
}

.block-makura-faq--a-ttl::before {
  display: block;
  content: "A.";
  color: #c8102e;
  flex-shrink: 0;
}

.block-makura-faq .block-makura-faq--a-text {
  margin: 0;
  font-size: 20px;
  line-height: 1.9;
}

.block-makura-faq--a-text .text-link {
  text-decoration: underline;
  color: var(--color-primary3);
  font-weight: 500;
}

.block-makura-faq--a-text .text-link:is(:hover, :focus) {
  text-decoration: none;
}

.block-makura-faq .block-makura-faq--a-text small {
  font-size: 16px;
}

@media (max-width: 768px) {
  .block-makura-faq {
    margin-top: 56px;
    padding: 44px 24px;
  }

  .block-makura-faq .block-makura-faq--title {
    column-gap: 16px;
    font-size: 24px;
  }

  .block-makura-faq .block-makura-faq--list {
    margin-top: 28px;
  }

  .block-makura-faq .block-makura-faq--q-button {
    column-gap: 10px;
    padding: 20px 4px;
  }

  .block-makura-faq .block-makura-faq--q-mark {
    font-size: 17px;
  }

  .block-makura-faq .block-makura-faq--q-text {
    font-size: 15px;
  }

  .block-makura-faq .block-makura-faq--q-icon {
    width: 18px;
    height: 18px;
  }

  .block-makura-faq .block-makura-faq--a {
    padding: 0 4px 20px 30px;
  }

  .block-makura-faq--a-ttl {
    font-size: 15px;
  }

  .block-makura-faq .block-makura-faq--a-text {
    font-size: 14px;
    line-height: 1.8;
  }

  .block-makura-faq .block-makura-faq--a-text small {
    font-size: 12px;
  }

  .block-makura-faq--a .block-makura-goods--foot {
    margin-top: 20px;
  }

  .block-makura-faq--a .block-makura-goods--button {
    font-size: 14px;
  }
}

/* ----- nishikawa枕 ブランド一覧 ----- */
.block-makura-brand {
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  padding: 60px clamp(45px, calc(50vw - 795px), 70px) 80px;
  background: #ebebeb;
  color: #333;
}

.block-makura-brand .block-makura-brand--title {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0;
  background-image: none;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.04em;
}

.block-makura-brand .block-makura-brand--grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
  max-width: 1600px;
  margin: 36px auto 0;
}

.block-makura-brand .block-makura-brand--card {
  display: flex;
  flex-direction: column;
  padding: 36px 30px 40px;
  background: #fff;
}

.block-makura-brand .block-makura-brand--logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 150px;
}

.block-makura-brand .block-makura-brand--logo img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 120px;
  height: auto;
}

.block-makura-brand .block-makura-brand--text {
  margin: 20px 0 0;
  font-size: 20px;
  line-height: 1.8;
}

.block-makura-brand .block-makura-brand--action {
  display: flex;
  justify-content: center;
  margin-top: auto;
  padding-top: 36px;
}

.block-makura-brand .block-makura-brand--button {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 10px;
  width: 100%;
  padding: 16px 16px;
  border-radius: 50vh;
  background: #333;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-brand .block-makura-brand--button::after {
  display: block;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  rotate: 45deg;
  content: "";
}

@media (min-width: 769px) {
  .block-makura-brand .block-makura-brand--button:is(:hover, :focus) {
    opacity: .85;
  }
}

@media (max-width: 768px) {
  .block-makura-brand {
    padding: 40px 24px 48px;
  }

  .block-makura-brand .block-makura-brand--title {
    font-size: 22px;
  }

  .block-makura-brand .block-makura-brand--grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .block-makura-brand .block-makura-brand--card {
    padding: 24px 16px 28px;
  }

  .block-makura-brand .block-makura-brand--logo {
    height: 100px;
  }

  .block-makura-brand .block-makura-brand--logo img {
    max-height: 80px;
  }

  .block-makura-brand .block-makura-brand--text {
    margin-top: 16px;
    font-size: 16px;
    line-height: 1.7;
  }

  .block-makura-brand .block-makura-brand--action {
    padding-top: 24px;
  }

  .block-makura-brand .block-makura-brand--button {
    padding: 14px 12px;
    font-size: 14px;
  }
}

/* ----- 関連特集 ----- */
.block-makura-related {
  max-width: 1600px;
  margin: 80px auto 110px;
  padding: 0;
  color: #333;
}

.block-makura-related .block-makura-related--title {
  margin: 0;
  padding: 0;
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.04em;
  background-image: none;
}

.block-makura-related .block-makura-related--list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  margin: 40px 0 0;
  padding: 0;
  list-style: none;
}

.block-makura-related .block-makura-related--link {
  display: block;
  color: inherit;
  text-decoration: none;
  transition: var(--transition-opacity);
}

.block-makura-related .block-makura-related--thumb img {
  display: block;
  width: 100%;
  height: auto;
}

.block-makura-related .block-makura-related--item-title {
  margin: 20px 0 0;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5;
}

.block-makura-related .block-makura-related--item-text {
  margin: 10px 0 0;
  font-size: 14px;
  line-height: 1.7;
}

@media (min-width: 769px) {
  .block-makura-related .block-makura-related--link:is(:hover, :focus) {
    opacity: .8;
  }
}

@media (max-width: 768px) {
  .block-makura-related {
    margin-top: 48px;
    margin-bottom: 64px;
  }

  .block-makura-related .block-makura-related--title {
    font-size: 24px;
  }

  .block-makura-related .block-makura-related--list {
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 28px;
  }

  .block-makura-related .block-makura-related--item-title {
    font-size: 16px;
  }

  .block-makura-related .block-makura-related--item-text {
    font-size: 13px;
  }
}

@media (max-width: 1264px) {
  .block-makura-fit,
  .block-makura-adjust,
  .block-makura-ordermade,
  .block-makura-brand,
  .block-makura-faq {
    margin-right: 0;
    margin-left: 0;
  }
}

/* override */
@media (max-width: 768px) {
  .block-howto {
    margin-bottom: 64px;
    width: 100vw;
    position: relative;
    left: -24px;
  }
}

@media screen and (min-width: 769px) and (max-width: 1750px) {
  .wrapper .pane-contents,
  .wrapper_ {
    padding-right: 0;
    padding-left: 0;
  }
  
  .block-makura-kotsu,
  .block-makura-point,
  .block-makura-hard,
  .block-makura-master {
    padding-right: clamp(45px, calc(50vw - 795px), 70px);
    padding-left: clamp(45px, calc(50vw - 795px), 70px);
  }
}