/* /note 記事ページ(2026-10-04) */
.zz-note {
  position: relative;
  width: 50vw;
  margin: 0 auto;
  padding: clamp(8rem, 14vw, 12rem) 0 clamp(4rem, 8vw, 7rem);
  color: #262627;
}
.zz-note__label {
  margin: 0;
  font-family: var(--en_sans);
  font-size: clamp(.9rem, 1.4vw, 1.2rem);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .14em;
  color: #777;
  text-transform: uppercase;
}
.zz-note__title {
  margin: clamp(1rem, 2vw, 1.5rem) 0 0;
  font-family: var(--ja_sans);
  font-size: clamp(1.45rem, 2.6vw, 2.2rem);
  font-weight: 800;
  line-height: 1.75;
  letter-spacing: .02em;
}
.zz-note__body {
  margin-top: clamp(2.4rem, 5vw, 4rem);
  font-size: 0.96em;
  line-height: 2.2;
  letter-spacing: .03em;
  overflow-wrap: anywhere;
  font-weight: 400;
}
.zz-note__body p { margin: 0 0 1.5em; }
.zz-note__body h2 { scroll-margin-top: 7rem; }
.zz-note__body h2 {
  margin: clamp(3rem, 6vw, 4.5rem) 0 1.2em;
  padding-top: clamp(1.6rem, 3vw, 2.2rem);
  border-top: 1px solid rgba(38, 38, 39, .14);
  font-size: clamp(1.12rem, 1.7vw, 1.4rem);
  font-weight: 800;
  line-height: 1.8;
  letter-spacing: .03em;
}
.zz-note__body ul {
  margin: 0 0 1.8em;
  padding: 0;
  list-style: none;
}
.zz-note__body ol {
  margin: 0 0 1.8em;
  padding-left: 1.5em;
  list-style: decimal;
}
.zz-note__body ol li { display: list-item; list-style: decimal outside; }
.zz-note__body ol li { margin-bottom: .35em; }
.zz-note__body ul li {
  position: relative;
  padding-left: 1.4em;
  margin-bottom: .35em;
}
.zz-note__body ul li::before {
  content: "";
  position: absolute;
  left: .2em;
  top: 1.02em;
  width: .5em;
  height: 1px;
  background: #262627;
}
.zz-note__body a {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: .2em;
  color: inherit;
}
.zz-note__body table {
  width: 100%;
  margin: .4em 0 2.2em;
  border-collapse: collapse;
  border-top: 1px solid rgba(38, 38, 39, .28);
  font-size: .92em;
  line-height: 1.9;
}
.zz-note__body th,
.zz-note__body td {
  padding: .95em .2em;
  border-bottom: 1px solid rgba(38, 38, 39, .14);
  text-align: left;
  vertical-align: top;
}
.zz-note__body thead th {
  border-bottom-color: rgba(38, 38, 39, .28);
  font-size: .9em;
  font-weight: 700;
  letter-spacing: .08em;
  color: rgba(38, 38, 39, .7);
}
.zz-note__body tbody td:first-child {
  width: 32%;
  padding-right: 1.2em;
  font-weight: 700;
}
/* 3列以上の表 */
.zz-note__body table.is-multi { font-size: .86em; }
.zz-note__body table.is-multi th,
.zz-note__body table.is-multi td { padding-right: 1em; }
.zz-note__body table.is-multi tbody td:first-child { width: 19%; }
.zz-note__back {
  margin-top: clamp(3rem, 6vw, 5rem);
  padding-top: clamp(1.5rem, 3vw, 2rem);
  border-top: 1px solid rgba(38, 38, 39, .14);
  font-size: .875rem;
}
.zz-note__back a { color: inherit; text-decoration: none; }

/* 右側:目次と正方形の誘導(PCのみ) */
.zz-note__main { position: relative; }
.zz-note__side {
  position: absolute;
  top: clamp(2.4rem, 5vw, 4rem);
  bottom: 0;
  left: calc(100% + 3.5vw);
  width: 16vw;
}
.zz-note__side-in {
  position: sticky;
  top: 7rem;
}
.zz-note__toc ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
.zz-note__toc li + li { margin-top: .9em; }
.zz-note__toc a {
  display: block;
  font-size: .76rem;
  line-height: 1.7;
  letter-spacing: .03em;
  color: #8a8a8a;
  text-decoration: none;
  transition: color .2s ease;
}
.zz-note__toc a:hover { color: #262627; opacity: 1; }
.zz-note__sq {
  position: relative;
  display: block;
  margin-top: 2rem;
  aspect-ratio: 1 / 1;
  background: #262627 center / cover no-repeat;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
}
.zz-note__sq::before,
.zz-note__cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(38, 38, 39, .5);
  transition: background .3s ease;
}
.zz-note__sq:hover,
.zz-note__cta:hover { opacity: 1; }
.zz-note__sq:hover::before,
.zz-note__cta:hover::before { background: rgba(38, 38, 39, .68); }
.zz-note__sq-in {
  position: absolute;
  inset: auto 1rem 1rem 1rem;
  display: grid;
  gap: .5rem;
}
.zz-note__sq-title {
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .04em;
}
.zz-note__sq-more { font-size: .7rem; letter-spacing: .06em; }

/* 下部:メイン画像を使ったサービスページへの誘導 */
.zz-note__cta {
  position: relative;
  display: flex;
  align-items: flex-end;
  width: 75vw;
  min-height: clamp(260px, 30vw, 460px);
  margin: clamp(3rem, 6vw, 5rem) 0 0 -12.5vw;
  background: #262627 center / cover no-repeat;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
}
.zz-note__cta-in {
  position: relative;
  display: grid;
  gap: .9rem;
  padding: clamp(1.6rem, 3.4vw, 3rem);
}
.zz-note__cta-title {
  font-size: clamp(1.15rem, 2vw, 1.7rem);
  font-weight: 800;
  line-height: 1.6;
  letter-spacing: .04em;
}
.zz-note__cta-text {
  font-size: clamp(.82rem, 1vw, .92rem);
  line-height: 1.9;
  letter-spacing: .04em;
}
.zz-note__cta-more {
  margin-top: .4rem;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .08em;
}

/* 一覧 */
.zz-note-list {
  margin: clamp(2rem, 4vw, 3rem) 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid rgba(38, 38, 39, .14);
}
.zz-note-list li { border-bottom: 1px solid rgba(38, 38, 39, .14); }
.zz-note-list a {
  display: grid;
  gap: .5rem;
  padding: clamp(1.4rem, 2.6vw, 2rem) 0;
  color: inherit;
  text-decoration: none;
}
.zz-note-list time {
  font-family: var(--en_sans);
  font-size: .82rem;
  color: #777;
}
.zz-note-list__title {
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  font-weight: 700;
  line-height: 1.8;
}
.zz-note-list__desc {
  font-size: .86rem;
  line-height: 1.9;
  color: rgba(38, 38, 39, .7);
}

@media (max-width: 1024px) {
  .zz-note { width: 70vw; }
  .zz-note__side { display: none; }
  .zz-note__cta { width: 100%; margin-left: 0; }
}
@media (max-width: 768px) {
  .zz-note { width: 86vw; padding-top: 8rem; }
  /* 表は1行ごとのカードに組み替える(横スクロールさせない) */
  .zz-note__body thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
  .zz-note__body table,
  .zz-note__body tbody,
  .zz-note__body tr,
  .zz-note__body td { display: block; }
  .zz-note__body td { border-bottom: 0; padding: 0 .1em .9em; }
  .zz-note__body tbody td:first-child {
    width: auto;
    padding: .9em .1em .2em;
  }
  .zz-note__body tbody tr { border-bottom: 1px solid rgba(38, 38, 39, .14); }
  .zz-note__body table.is-multi { font-size: .92em; }
  .zz-note__body table.is-multi tbody td:first-child { width: auto; }
  .zz-note__body table.is-multi td:not(:first-child) { padding-top: .5em; }
  .zz-note__body table.is-multi td:not(:first-child)::before {
    content: attr(data-label);
    display: block;
    font-size: .82em;
    letter-spacing: .06em;
    color: #8a8a8a;
  }
}

/* ===== 津田 2026-10-11 追記: 本文中リンクのインライン化(global.css の a{display:block} 打ち消し) ===== */
.zz-note__body p a,
.zz-note__body li a {
  display: inline;
}
